/* Ketabika reference-led redesign: layout, not just recoloring */
:root{--kb-primary:#4d43df;--kb-secondary:#7068ff;--kb-ink:#202c9a;--kb-muted:#7c84b8;--kb-line:#e4e7ff;--kb-soft:#f4f5ff;--kb-shadow:0 8px 24px rgba(47,52,150,.07)}
html{scroll-behavior:smooth}body{background:linear-gradient(180deg,#f5f6ff 0%,#fff 52%,#f7f8ff 100%);color:#202b83;font-family:Tahoma,Arial,sans-serif}.container{width:min(1390px,calc(100% - 64px))}
.site-header{position:relative;background:#fff;border-bottom:0;box-shadow:0 2px 14px rgba(40,47,151,.07)}
.header-row{min-height:84px;display:grid;grid-template-columns:minmax(220px,330px) minmax(260px,1fr) auto;grid-template-areas:"logo search actions" "nav nav nav";gap:0 30px;align-items:center;padding:10px 0 0}
.logo{grid-area:logo;flex:auto;justify-content:flex-start;min-height:66px}.site-logo-image{width:290px;max-height:65px;object-position:left center}.logo-mark{background:linear-gradient(135deg,#5046df,#7167ff);border-radius:10px}.logo-fallback-text{color:#26329a;font-size:30px;letter-spacing:.2px}.logo-fallback-text small{letter-spacing:2px;color:#858ab5}
.search{grid-area:search;max-width:none;width:100%;height:46px;border:1px solid #dfe2ff;border-radius:14px;overflow:hidden;background:#f9faff}.search input{min-width:0;border:0!important;border-radius:0!important;background:transparent;padding:0 18px;color:#252e8f}.search button{min-width:58px;background:linear-gradient(135deg,#4c43df,#6b62fa);border-radius:9px!important;margin:3px;padding:0 15px}
.header-actions{grid-area:actions;display:flex;gap:12px;align-items:center;justify-content:flex-end}.header-action-link{display:inline-flex;align-items:center;gap:8px;padding:10px 13px;border:1px solid #e2e5ff;border-radius:12px;color:#292f8e;font-weight:700;white-space:nowrap;background:#fff}.header-action-icon{font-size:19px;color:#4c43df}.cart-badge{background:#4e45df;color:#fff;padding:2px 7px}
.primary-nav{grid-area:nav;display:flex!important;align-items:center;justify-content:space-around;gap:10px!important;width:100%;min-height:55px;margin-top:8px;padding:0 12px;background:linear-gradient(100deg,#373bb2,#4842c9 55%,#3536a8);color:#fff;font-size:15px!important}.primary-nav>a,.primary-nav .nav-main-link{display:flex;align-items:center;justify-content:center;gap:8px;min-height:55px;padding:0 17px;color:#fff!important;font-weight:700;border-bottom:3px solid transparent}.primary-nav>a:hover,.primary-nav .nav-main-link:hover{background:rgba(255,255,255,.08);border-bottom-color:#fff}.nav-item{position:relative}.nav-submenu{background:#fff;color:#252e8f;border:1px solid var(--kb-line);border-radius:12px;box-shadow:var(--kb-shadow)}.nav-submenu a{color:#252e8f}
/* Main hero: wide, editorial banner */
.latest-hero{min-height:315px;padding:0;color:#252d96;background:linear-gradient(105deg,#dce0ff 0%,#f5f6ff 58%,#e8eaff 100%);border-bottom:1px solid #dfe2ff}.latest-slides{min-height:315px}.latest-slide{min-height:315px}.latest-slide-bg{inset:0;background-position:center;background-size:cover;opacity:.15;filter:saturate(.5)}.latest-slide-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(244,246,255,.12),rgba(245,246,255,.9) 48%,#f5f6ff 100%)}.latest-slide-inner{min-height:315px;display:grid;grid-template-columns:minmax(190px,280px) 1fr;gap:50px;align-items:center;position:relative;z-index:1}.latest-poster{grid-column:1;grid-row:1;width:210px;height:245px;justify-self:center;border:0;border-radius:0;background:transparent;box-shadow:none}.latest-poster img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 12px 20px rgba(35,40,128,.18));border-radius:7px}.latest-copy{grid-column:2;grid-row:1;text-align:right;max-width:780px}.latest-kicker{color:#4f47df;font-weight:800;font-size:13px}.latest-copy h1{font-size:clamp(27px,3.2vw,44px);line-height:1.2;color:#29349e;margin:6px 0 10px;font-weight:900}.latest-copy p,.latest-author{color:#707ab7}.latest-actions{display:flex;align-items:center;gap:16px;margin-top:16px}.latest-price{color:#3438b1;font-weight:900;font-size:20px}.btn{border-radius:12px;background:linear-gradient(135deg,#4d44df,#6a61f5);box-shadow:0 5px 13px rgba(74,68,220,.12);transition:transform .18s,box-shadow .18s}.btn:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(74,68,220,.2)}.btn.dark{background:#3435ad}.btn.light{background:#fff;color:#3436a8;border:1px solid #dfe2ff;box-shadow:none}.latest-dots{bottom:12px}.latest-dot{background:#b7baf2}.latest-dot.active{background:#4e45df}
/* Categories */
.section{padding:38px 0}.category-showcase{padding-top:35px;padding-bottom:24px}.category-showcase-head{display:flex;justify-content:flex-end;text-align:right;margin-bottom:20px}.category-eyebrow{font-size:13px;color:#706fd1}.category-showcase-head h2,.section-head h2{font-size:27px;font-weight:900;color:#29349d;line-height:1.35}.category-showcase-head p,.muted{color:#8189bd;font-size:13px}.category-grid#categoryGrid{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:14px!important}.category-tile,#categoryGrid>.category-tile{min-height:126px!important;padding:14px 12px!important;border:1px solid #e1e4ff!important;border-radius:17px!important;background:linear-gradient(145deg,#fff,#f8f8ff)!important;box-shadow:0 5px 18px rgba(45,53,147,.035)!important;color:#161f7c;justify-content:center}.category-icon{width:58px!important;height:58px!important;border-radius:17px!important;background:#f0f1ff!important;color:#4f48e5!important;border:1px solid #e0e2ff!important;display:grid;place-items:center}.category-icon svg{width:34px;height:34px}.category-tile-title{font-size:15px!important;font-weight:800!important;line-height:1.4!important}.category-tile-count{font-size:12px!important;color:#8389b8!important}.category-arrow{display:none!important}.category-more-wrap-top{direction:ltr!important;justify-content:flex-start!important;margin:0 0 14px!important}.category-showcase #categoryMoreButton{min-height:42px!important;border-radius:12px!important;padding:10px 20px!important;background:linear-gradient(135deg,#4d44df,#6960f6)!important;color:#fff!important;box-shadow:0 5px 14px rgba(75,67,220,.2)!important}
/* Book merchandising grid */
.home-merch{padding-top:28px;padding-bottom:26px}.section-head{align-items:flex-end;margin-bottom:18px}.section-head h2{margin:0 0 4px}.section-head .btn{padding:10px 18px}.product-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:18px;perspective:none}.product-card{border:1px solid #e4e7ff;border-radius:17px;background:linear-gradient(180deg,#fff,#fafaff);box-shadow:0 5px 18px rgba(46,53,150,.045);overflow:hidden;display:flex;flex-direction:column}.product-card:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(57,60,173,.11)}.cover{aspect-ratio:1/1.05;background:#f0f2ff;padding:12px;display:flex;align-items:center;justify-content:center}.cover img{width:100%;height:100%;object-fit:contain;border-radius:5px}.product-info{padding:12px 12px 14px;display:flex;flex-direction:column;flex:1;text-align:center}.product-info h3{font-size:14px;color:#252f99;line-height:1.5;min-height:42px}.author{font-size:12px;color:#8b91bd;min-height:20px}.price{justify-content:center;color:#4541d6;margin-top:8px}.card-actions{display:flex;flex-direction:column;gap:7px;margin-top:auto;padding-top:12px}.card-actions form{display:flex;gap:6px}.card-actions .btn{font-size:12px;padding:9px 6px;border-radius:999px;white-space:nowrap}.card-actions form .btn{flex:1}.sale{background:#ffdfec;color:#bd3168;border-radius:8px}
/* Detail, account, cart and forms */
.detail{padding:36px 0}.detail-grid{grid-template-columns:minmax(260px,390px) minmax(0,1fr);gap:38px}.detail-cover{border:1px solid #e1e4ff;border-radius:20px;padding:20px;background:#fff;box-shadow:var(--kb-shadow)}.detail-cover img{max-height:470px;object-fit:contain}.detail h1{color:#28339c;font-size:clamp(28px,3vw,40px);line-height:1.3}.meta{background:#f9faff;border-color:#e3e6ff;border-radius:12px}.buy-box,.form-card,.summary{border:1px solid #e1e5ff;border-radius:18px;box-shadow:var(--kb-shadow);background:#fff}.input,.select,.textarea,.qty{border-color:#dfe3ff;border-radius:11px}.input:focus,.select:focus,.textarea:focus{outline:2px solid #d8d9ff;border-color:#7169f6}.cart-table{border:1px solid #e2e5ff;border-radius:16px}.cart-table th{background:#f3f4ff;color:#28339c}.footer{margin-top:34px;background:linear-gradient(115deg,#3036ac,#4946d5);color:#eef0ff;padding-top:38px}.footer a{color:#eef0ff}.copyright{border-color:rgba(255,255,255,.18);color:#c9ceff}
@media(max-width:1100px){.container{width:min(100% - 36px,1390px)}.header-row{grid-template-columns:220px minmax(220px,1fr);grid-template-areas:"logo actions" "search search" "nav nav";gap:6px 18px;padding-top:8px}.search{margin:3px 0 8px}.site-logo-image{width:220px}.primary-nav{overflow-x:auto;justify-content:flex-start;white-space:nowrap}.product-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.category-grid#categoryGrid{grid-template-columns:repeat(4,minmax(0,1fr))!important}}
@media(max-width:700px){.container{width:calc(100% - 24px)}.header-row{display:flex;flex-wrap:wrap;gap:8px;padding:8px 0 0}.logo{min-height:48px;flex:1;justify-content:flex-start}.site-logo-image{width:185px;max-height:48px}.logo-fallback-text{font-size:23px}.header-actions{gap:5px}.header-action-link{padding:7px 9px;font-size:12px}.header-action-icon{font-size:16px}.search{order:3;flex-basis:100%;height:42px;margin:2px 0 8px}.primary-nav{order:4;min-height:46px;margin-top:0;width:calc(100% + 24px);margin-inline:-12px;padding:0 7px;gap:0!important}.primary-nav>a,.primary-nav .nav-main-link{min-height:46px;padding:0 11px;font-size:12px}.latest-hero,.latest-slides,.latest-slide{min-height:280px}.latest-slide-inner{min-height:280px;grid-template-columns:105px minmax(0,1fr);gap:15px;padding:18px 0 35px}.latest-poster{width:100px;height:150px}.latest-copy h1{font-size:22px}.latest-copy p{font-size:12px}.latest-author{font-size:12px}.latest-price{font-size:15px}.latest-actions{gap:9px;flex-wrap:wrap}.latest-actions .btn{font-size:12px;padding:8px 12px}.section{padding:25px 0}.category-showcase-head h2,.section-head h2{font-size:22px}.category-grid#categoryGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}.category-tile,#categoryGrid>.category-tile{min-height:112px!important;padding:10px 7px!important}.category-icon{width:46px!important;height:46px!important}.category-tile-title{font-size:13px!important}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.product-info{padding:9px}.product-info h3{font-size:13px;min-height:39px}.cover{padding:9px}.card-actions form{flex-direction:column}.detail-grid{grid-template-columns:1fr;gap:20px}.detail-cover{max-width:280px;margin:auto}.detail h1{font-size:27px}.footer-grid{grid-template-columns:1fr 1fr;gap:18px}}
@media(max-width:420px){.header-action-link{gap:4px;padding:6px}.header-action-link span:nth-child(2){font-size:11px}.logo-fallback-text{font-size:20px}.site-logo-image{width:155px}.latest-slide-inner{grid-template-columns:80px minmax(0,1fr);gap:10px}.latest-poster{width:78px;height:125px}.latest-copy h1{font-size:19px}.footer-grid{grid-template-columns:1fr}}
/* Additional reference details and complete secondary pages */
.header-actions{gap:10px}.header-action-link{min-height:42px}.header-favorite-link .header-action-icon{font-size:25px;line-height:1}.page-heading{text-align:right;margin:0 0 28px}.page-heading h1,.editorial-card h1{font-size:clamp(28px,3vw,42px);font-weight:900;color:#3036ad;margin:8px 0}.page-heading p,.editorial-card p{color:#747db5;line-height:1.9}.empty-state{max-width:650px;margin:35px auto;padding:45px 24px;text-align:center;background:linear-gradient(145deg,#fff,#f4f5ff);border:1px solid #e0e4ff;border-radius:24px;box-shadow:var(--kb-shadow)}.empty-state-icon{width:72px;height:72px;margin:0 auto 18px;display:grid;place-items:center;border-radius:22px;background:#e9eaff;color:#4d43df;font-size:48px}.empty-state h2{color:#292f96}.empty-state p{color:#7c84b8;margin-bottom:22px}.wishlist-grid{align-items:stretch}.wishlist-grid .card-actions form{display:block}.wishlist-grid .card-actions form .btn{width:100%}.wishlist-icon-button{width:34px;height:34px;border-radius:50%;border:1px solid #dfe2ff;background:#fff;color:#5148e9;font-size:22px;cursor:pointer}.wishlist-icon-button:hover{background:#efefff}.editorial-card{max-width:1050px;margin:auto;padding:clamp(24px,5vw,60px);border:1px solid #e0e4ff;border-radius:26px;background:radial-gradient(ellipse at top left,#e8eaff,transparent 48%),linear-gradient(145deg,#fff,#f7f8ff);box-shadow:var(--kb-shadow)}.editorial-card>p{max-width:780px;font-size:17px}.about-highlights{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:30px 0}.about-highlights>div,.contact-card{padding:22px;border:1px solid #e1e5ff;border-radius:18px;background:rgba(255,255,255,.84)}.about-highlights strong{display:block;color:#4c43df;font-size:18px;margin-bottom:8px}.about-highlights span{color:#777fb4;line-height:1.8}.contact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.contact-card{box-shadow:var(--kb-shadow)}.contact-symbol{display:grid;place-items:center;width:54px;height:54px;border-radius:16px;background:#ededff;color:#4d43df;font-size:26px}.contact-card h2{font-size:19px;color:#292f96}.contact-card p,.contact-card a{color:#737bb0;overflow-wrap:anywhere}
@media(max-width:700px){.about-highlights,.contact-grid{grid-template-columns:1fr}.editorial-card{padding:24px 18px}.header-actions{flex-wrap:wrap}.header-favorite-link{display:none}}


/* v5: layout refinements based on supplied multi-page reference */
:root{--kb-primary:#4944e8;--kb-secondary:#7168ff;--kb-ink:#222f9b;--kb-muted:#8189b8;--kb-line:#e0e5ff;--kb-soft:#f2f4ff;--kb-shadow:0 5px 18px rgba(54,62,180,.08)}
body{background:#f7f8ff;color:#202c91;font-family:Tahoma,Arial,sans-serif}
.container{width:min(1380px,calc(100% - 48px))}
.site-header{position:relative;box-shadow:none;background:#fff;border-bottom:1px solid #e4e7ff}
.header-row{grid-template-columns:minmax(180px,260px) minmax(280px,1fr) auto;grid-template-areas:"logo search actions" "nav nav nav";gap:0 24px;min-height:0;padding:8px 0 0}
.logo{min-height:64px}.site-logo-image{width:250px;max-height:58px;object-fit:contain}.logo-fallback-text{font-size:29px;color:#3237b5}.search{height:44px;max-width:540px;border-radius:13px;background:#f9faff}.search input{font-size:13px}.search button{background:linear-gradient(135deg,#393bc5,#6258f3);margin:3px;border-radius:9px!important}
.header-actions{justify-content:flex-end;gap:8px}.header-action-link{border:1px solid #e4e7ff;border-radius:12px;background:#fff;padding:8px 12px;color:#29349d;font-weight:700}.header-action-link:hover{background:#f1f2ff;border-color:#cfd4ff}
.primary-nav{grid-area:nav;width:100%;min-height:48px;background:linear-gradient(90deg,#3638b7,#4c48dc);display:flex;align-items:center;justify-content:space-around;padding:0 max(16px,calc((100% - 1300px)/2));margin-top:0;color:#fff;border-radius:0}.primary-nav>a,.primary-nav .nav-main-link{color:#fff;min-height:48px;display:flex;align-items:center;padding:0 15px;font-size:13px;font-weight:700;border-bottom:3px solid transparent}.primary-nav>a:hover,.primary-nav .nav-main-link:hover,.primary-nav .active{background:rgba(255,255,255,.08);border-bottom-color:#fff}
.latest-hero,.latest-slides,.latest-slide{min-height:310px}.latest-hero{background:#e9ebff;color:#29339b;overflow:hidden}.latest-slide{background:linear-gradient(90deg,rgba(51,54,172,.10),rgba(255,255,255,.82))}.latest-slide-bg{opacity:.3;background-size:cover;background-position:center}.latest-slide-inner{min-height:310px;grid-template-columns:minmax(145px,230px) minmax(0,1fr);gap:clamp(24px,5vw,70px);padding:28px 0 40px}.latest-poster{width:190px;height:245px;object-fit:contain;filter:drop-shadow(0 12px 20px rgba(27,31,118,.22));border-radius:8px}.latest-copy{text-align:right}.latest-copy h1{font-size:clamp(27px,3vw,43px);line-height:1.25;color:#252f9e}.latest-copy p{color:#6872b2;line-height:1.9}.latest-kicker{color:#4d4fe3}.latest-actions .btn{border-radius:24px;padding:12px 24px}.latest-dots{bottom:10px}
.section{padding:34px 0}.category-showcase{padding-top:32px;padding-bottom:28px}.category-showcase-head{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:18px}.category-showcase-head h2,.section-head h2{font-size:clamp(22px,2vw,30px);font-weight:900;color:#343cc1;margin:0}.category-more-wrap-top{display:flex;justify-content:flex-start;margin:0 0 14px}.btn.dark,.btn.dark.category-more,.category-more{background:linear-gradient(135deg,#3935bc,#5149e9);color:#fff;border:0;border-radius:10px;box-shadow:0 5px 12px rgba(57,53,188,.18);font-weight:800;padding:11px 20px;min-height:42px}.btn.dark:hover,.category-more:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(57,53,188,.25)}
.category-grid#categoryGrid{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:14px!important}.category-tile,#categoryGrid>.category-tile{min-height:150px!important;border:1px solid #e0e4ff!important;border-radius:18px!important;background:linear-gradient(145deg,#fff,#f8f9ff)!important;box-shadow:0 4px 15px rgba(55,62,160,.04);padding:18px 12px!important;transition:transform .2s,box-shadow .2s,border-color .2s}.category-tile:hover{transform:translateY(-3px);border-color:#bfc5ff!important;box-shadow:0 10px 24px rgba(55,62,160,.10)}.category-icon{width:56px!important;height:56px!important;border-radius:15px!important;background:#f0f1ff!important;border:1px solid #dfe2ff;color:#4c49ed;box-shadow:0 4px 12px rgba(65,65,190,.06)}.category-tile-title{font-size:15px!important;line-height:1.45;color:#111c71;font-weight:800}.category-tile-count{font-size:12px;color:#838aba}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px}.product-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}.product-card{position:relative;overflow:hidden;border:1px solid #e0e5ff;border-radius:17px;background:linear-gradient(180deg,#fff,#fafbff);box-shadow:0 4px 16px rgba(47,56,160,.05);transition:transform .2s,box-shadow .2s}.product-card:hover{transform:translateY(-4px);box-shadow:0 12px 25px rgba(47,56,160,.12)}.product-card .cover{height:205px;padding:14px 12px 4px;background:transparent;display:flex;align-items:center;justify-content:center}.product-card .cover img{max-height:190px;max-width:100%;object-fit:contain;border-radius:5px;box-shadow:0 5px 12px rgba(20,25,70,.14)}.product-info{padding:10px 12px 14px;text-align:center}.product-info h3{font-size:14px;color:#242f9b;line-height:1.5;min-height:42px;margin:0 0 4px}.product-info .author{font-size:11px;color:#8990bb;min-height:20px}.product-info .price{font-size:16px;font-weight:900;color:#4542dc;margin:7px 0}.card-actions .btn{width:100%;border-radius:24px;background:linear-gradient(135deg,#4642df,#6158f5);color:#fff;padding:10px 8px;font-weight:800;font-size:12px}.wishlist-icon-button{position:absolute;top:10px;right:10px;z-index:2;border:0;background:#fff;color:#5148ed;box-shadow:0 2px 8px #202b9418}
.detail-grid{gap:36px}.detail,.panel,.form-card,.cart-card,.profile-card{border:1px solid #e1e5ff;border-radius:20px;background:#fff;box-shadow:var(--kb-shadow)}.detail h1{color:#27329d}.detail .price{color:#4542df}.detail .btn{border-radius:24px}.form-card input,.form-card select,.form-card textarea,.search input{border-color:#dfe3ff;background:#fbfbff;border-radius:10px}.footer{background:linear-gradient(120deg,#3438b7,#4c48df);color:#fff}.footer a,.footer p,.footer small{color:#e4e6ff}
@media(min-width:1200px){.home-merch .product-grid{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:1050px){.container{width:calc(100% - 32px)}.header-row{grid-template-columns:210px minmax(180px,1fr);grid-template-areas:"logo actions" "search search" "nav nav";gap:6px 16px;padding-top:8px}.search{max-width:none;margin:2px 0 8px}.product-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.category-grid#categoryGrid{grid-template-columns:repeat(4,minmax(0,1fr))!important}.latest-slide-inner{grid-template-columns:160px minmax(0,1fr)}}
@media(max-width:700px){.container{width:calc(100% - 22px)}.header-row{display:flex;flex-wrap:wrap;gap:7px;padding-top:6px}.logo{flex:1;min-width:145px;min-height:48px}.site-logo-image{width:175px;max-height:45px}.header-actions{gap:4px}.header-action-link{min-height:36px;padding:6px 8px;font-size:11px}.search{order:3;flex-basis:100%;height:41px;margin:0 0 7px}.primary-nav{order:4;overflow-x:auto;justify-content:flex-start;white-space:nowrap;width:calc(100% + 22px);margin-inline:-11px;padding:0 5px}.primary-nav>a,.primary-nav .nav-main-link{min-height:43px;padding:0 11px;font-size:11px}.latest-hero,.latest-slides,.latest-slide{min-height:245px}.latest-slide-inner{min-height:245px;grid-template-columns:88px minmax(0,1fr);gap:12px;padding:18px 0 32px}.latest-poster{width:84px;height:132px}.latest-copy h1{font-size:21px}.latest-copy p{font-size:12px}.latest-actions .btn{padding:8px 13px;font-size:12px}.category-showcase-head{align-items:flex-start;flex-direction:column}.category-grid#categoryGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}.category-tile,#categoryGrid>.category-tile{min-height:118px!important;padding:11px 7px!important;border-radius:14px!important}.category-icon{width:43px!important;height:43px!important}.category-tile-title{font-size:12px!important}.section{padding:24px 0}.section-head h2{font-size:21px}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.product-card .cover{height:165px}.product-card .cover img{max-height:150px}.product-info{padding:8px}.product-info h3{font-size:12px;min-height:36px}.product-info .price{font-size:14px}.card-actions .btn{font-size:11px}.detail-grid{grid-template-columns:1fr;gap:20px}.detail-cover{max-width:260px;margin:auto}.footer-grid{grid-template-columns:1fr 1fr;gap:16px}}
@media(max-width:420px){.site-logo-image{width:145px}.header-action-link{padding:5px}.latest-slide-inner{grid-template-columns:70px minmax(0,1fr)}.latest-poster{width:68px;height:110px}.latest-copy h1{font-size:18px}.footer-grid{grid-template-columns:1fr}}

/* v6: reference-led layout pass */
:root{--kb-primary:#4842e8;--kb-secondary:#6860f5;--kb-ink:#252e9b;--kb-muted:#858dbb;--kb-line:#e0e5ff;--kb-soft:#f4f5ff;--kb-shadow:0 8px 24px rgba(53,61,170,.075)}
html{scroll-behavior:smooth}body{background:#f7f8ff;color:#202b91;font-family:Tahoma,Arial,sans-serif}a{transition:color .18s,background .18s,border-color .18s,transform .18s}
.site-header{background:#fff;border-bottom:1px solid #dfe3ff}.header-row{width:min(1370px,calc(100% - 48px));grid-template-columns:minmax(210px,310px) minmax(250px,1fr) auto;grid-template-areas:"logo search actions" "nav nav nav";column-gap:22px;padding-top:8px}.logo{justify-content:flex-start;gap:10px}.site-logo-image{width:285px;max-height:62px;object-fit:contain}.logo-mark{background:#4b46e8;border-radius:12px}.search{height:46px;max-width:550px;border:1px solid #dfe3ff;background:#fafaff;border-radius:14px;overflow:visible!important;position:relative;z-index:1000}.search input{background:transparent;padding-inline:15px}.search button{background:#4b45e8;color:white;border-radius:10px;margin:3px;padding:0 18px}.header-actions{gap:9px}.header-action-link{display:inline-flex;align-items:center;gap:7px;min-height:42px;border:1px solid #e1e5f7;border-radius:13px;background:#fff;padding:8px 13px;color:#18215f;font-size:14px;font-weight:800}.header-action-icon{color:#4d48e8;font-size:21px}.cart-badge{background:#b91c5c;color:#fff;border-radius:50%;min-width:20px;height:20px;display:inline-grid;place-items:center;font-size:11px}
.primary-nav{width:100%;min-height:56px;margin-top:8px;background:linear-gradient(105deg,#3437ad,#4c48df);justify-content:space-between;padding:0 max(22px,calc((100% - 1290px)/2));gap:4px}.primary-nav>a,.primary-nav .nav-main-link{min-height:56px;padding:0 17px;color:#fff;font-size:14px;font-weight:800;border-bottom:3px solid transparent}.primary-nav>a:hover,.primary-nav .nav-main-link:hover,.primary-nav .active{background:rgba(255,255,255,.08);border-bottom-color:#fff}
.latest-hero,.latest-slides,.latest-slide{min-height:310px}.latest-hero{position:relative;background:linear-gradient(100deg,#d8dcff 0%,#f6f7ff 52%,#e7eaff 100%);border-bottom:1px solid #dce1ff;color:#28319a}.latest-slide{background:linear-gradient(100deg,rgba(63,67,188,.12),rgba(255,255,255,.82))}.latest-slide-bg{opacity:.17;background-size:cover;background-position:center;filter:saturate(.55)}.latest-slide-inner{width:min(1290px,calc(100% - 48px));min-height:310px;grid-template-columns:minmax(170px,260px) minmax(0,1fr);gap:clamp(28px,6vw,88px);padding:28px 0 42px}.latest-poster{width:180px;height:242px;border-radius:7px;background:#fff;box-shadow:0 12px 28px rgba(32,38,120,.2);padding:8px;object-fit:contain}.latest-copy{max-width:780px;text-align:right}.latest-kicker{font-size:13px;font-weight:800;color:#5148e8}.latest-copy h1{font-size:clamp(28px,3vw,44px);font-weight:900;letter-spacing:-.4px;line-height:1.3;color:#27329d;margin:10px 0}.latest-copy p{font-size:15px;color:#737db7;line-height:1.9}.latest-actions{display:flex;align-items:center;gap:14px}.latest-actions .btn{border:1px solid #dfe3ff;background:#fff;color:#3338b5;border-radius:24px;padding:12px 24px;font-weight:800}.latest-price{font-size:20px;color:#353bd0;font-weight:900}.latest-dots{bottom:10px}.latest-dot{width:9px;height:9px;background:#c7cbf7}.latest-dot.active{width:27px;background:#5148e8;border-radius:20px}
.category-showcase{padding:38px 0 28px}.category-showcase-head{justify-content:flex-start;margin-bottom:24px}.category-showcase-head h2,.section-head h2{font-size:clamp(24px,2.2vw,32px);color:#343bc0;font-weight:900}.category-showcase-head p{font-size:13px;color:#7e86b7;margin-top:6px}.category-more-wrap-top{margin-bottom:14px!important}.category-more,.btn.dark.category-more{border-radius:12px!important;background:linear-gradient(115deg,#4942e8,#665df7)!important;padding:12px 21px!important;min-height:44px!important;box-shadow:0 6px 14px rgba(70,65,220,.2)!important}.category-grid#categoryGrid{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:14px!important}.category-tile,#categoryGrid>.category-tile{min-height:145px!important;border:1px solid #dfe4ff!important;border-radius:18px!important;background:linear-gradient(145deg,#fff,#f9faff)!important;padding:17px 12px!important;box-shadow:0 5px 18px rgba(56,64,168,.035)!important}.category-icon{width:54px!important;height:54px!important;border-radius:15px!important;background:#f1f2ff!important;border:1px solid #dfe2ff!important;color:#5049f0!important}.category-tile-title{font-size:14px!important;font-weight:800!important;color:#111b71!important}.category-tile-count{font-size:12px!important;color:#858dbb!important}
.home-merch{padding:28px 0 36px}.section-head{margin-bottom:20px}.section-head h2{position:relative;padding-bottom:10px}.section-head h2:after{content:"";position:absolute;right:0;bottom:0;width:42px;height:3px;border-radius:3px;background:#5148ed}.section-head .btn{border-radius:12px!important;background:linear-gradient(115deg,#4942e8,#665df7)!important;box-shadow:0 6px 14px rgba(70,65,220,.17);padding:11px 20px!important}.product-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:18px}.product-card{border:1px solid #e0e5ff;border-radius:18px;background:linear-gradient(180deg,#fff,#fbfbff);box-shadow:0 5px 18px rgba(44,52,151,.045);overflow:hidden}.product-card .cover{height:205px;padding:14px 12px 5px;background:transparent}.product-card .cover img{max-height:190px;max-width:100%;object-fit:contain;border-radius:5px;box-shadow:0 6px 14px rgba(20,25,70,.13)}.product-info{padding:11px 12px 14px;text-align:center}.product-info h3{font-size:14px;line-height:1.5;color:#27339d;min-height:42px}.product-info .author{font-size:11px;color:#8991bd;min-height:18px}.product-info .price{font-size:16px;font-weight:900;color:#4b45e8;margin:8px 0 10px}.card-actions{gap:7px}.card-actions>.btn{border-radius:999px;background:linear-gradient(110deg,#4942e8,#665df7);color:#fff}.card-actions form .btn{border-radius:999px}.wishlist-icon-button{top:10px;right:10px;width:36px;height:36px;border-radius:50%;background:#fff;border:1px solid #edf0ff;color:#5148ed;box-shadow:0 3px 10px #26319b18;font-size:24px}
.detail,.form-card,.summary,.cart-card,.profile-card,.panel{border:1px solid #e0e5ff;border-radius:18px;background:#fff;box-shadow:var(--kb-shadow)}.detail h1,.page-heading h1{color:#29339f}.input,.select,.textarea{border:1px solid #dfe4ff;border-radius:11px;background:#fcfcff}.footer{background:linear-gradient(110deg,#3035a9,#4b46d7);color:#fff}.footer a,.footer p,.footer small{color:#e7e9ff}
@media(max-width:1100px){.header-row{width:calc(100% - 32px);grid-template-columns:190px minmax(200px,1fr);grid-template-areas:"logo actions" "search search" "nav nav";gap:7px 14px}.site-logo-image{width:225px}.search{max-width:none}.product-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.category-grid#categoryGrid{grid-template-columns:repeat(4,minmax(0,1fr))!important}.primary-nav{overflow-x:auto;justify-content:flex-start;white-space:nowrap;padding:0 12px}}
@media(max-width:700px){.header-row{width:calc(100% - 22px);display:flex;flex-wrap:wrap;gap:7px;padding-top:7px}.logo{flex:1;min-width:145px;min-height:45px}.site-logo-image{width:175px;max-height:46px}.header-actions{gap:4px}.header-action-link{min-height:34px;padding:6px 8px;font-size:11px}.header-action-icon{font-size:17px}.search{order:3;flex-basis:100%;height:42px;margin:0 0 7px}.primary-nav{order:4;width:calc(100% + 22px);margin-inline:-11px;min-height:44px;padding:0 5px}.primary-nav>a,.primary-nav .nav-main-link{min-height:44px;padding:0 11px;font-size:11px}.latest-hero,.latest-slides,.latest-slide{min-height:245px}.latest-slide-inner{width:calc(100% - 22px);min-height:245px;grid-template-columns:82px minmax(0,1fr);gap:12px;padding:17px 0 32px}.latest-poster{width:78px;height:122px;padding:4px}.latest-copy h1{font-size:20px}.latest-copy p{font-size:12px}.latest-price{font-size:15px}.latest-actions .btn{padding:8px 12px;font-size:12px}.category-showcase{padding:25px 0}.category-showcase-head h2,.section-head h2{font-size:22px}.category-grid#categoryGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}.category-tile,#categoryGrid>.category-tile{min-height:116px!important;padding:11px 7px!important;border-radius:14px!important}.category-icon{width:43px!important;height:43px!important}.category-tile-title{font-size:12px!important}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.product-card .cover{height:160px;padding:8px}.product-card .cover img{max-height:145px}.product-info{padding:8px}.product-info h3{font-size:12px;min-height:36px}.product-info .price{font-size:14px}.card-actions .btn{font-size:11px;padding:9px 6px}.section{padding:23px 0}.detail-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr;gap:14px}}
@media(max-width:420px){.site-logo-image{width:145px}.header-action-link{padding:5px}.latest-slide-inner{grid-template-columns:65px minmax(0,1fr)}.latest-poster{width:62px;height:102px}.latest-copy h1{font-size:17px}.latest-actions{gap:7px}.footer-grid{grid-template-columns:1fr}}

.detail-cover{display:flex;align-items:center;justify-content:center;min-height:360px;background:#fff}
.detail-cover img{display:block;width:auto!important;height:auto!important;max-width:100%!important;max-height:470px!important;object-fit:contain!important;object-position:center!important}
@media(max-width:700px){.detail-cover{min-height:280px;padding:16px}.detail-cover img{max-height:360px!important}}
.category-more-wrap-top{display:flex!important;justify-content:flex-start!important;direction:ltr!important}
#categoryMoreButton,.category-more{background:linear-gradient(115deg,#4942e8,#665df7)!important;color:#fff!important;border:0!important;border-radius:12px!important;box-shadow:0 6px 14px rgba(70,65,220,.2)!important;font-weight:800!important}


/* ==========================================================================
   KETABIKA MODERN BOOK CARDS & GRID SYSTEM
   Balanced, compact, realistic 3D book feel, responsive & lightweight
   ========================================================================== */

/* Main content container */
.container,
main > .container,
section .container,
.products-section > .container {
  width: min(1320px, calc(100% - 40px)) !important;
  max-width: 1320px !important;
  margin-inline: auto !important;
  box-sizing: border-box !important;
}

/* Product grid: 6 columns on large screens, adapts smoothly down to 2 columns */
.product-grid {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 16px !important;
  align-items: stretch !important;
  width: 100% !important;
  margin-top: 14px !important;
  box-sizing: border-box !important;
}

/* Responsive grid columns */
@media (max-width: 1200px) {
  .product-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }
}
@media (max-width: 980px) {
  .product-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }
}
@media (max-width: 760px) {
  .product-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
}
@media (max-width: 520px) {
  .product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
}

/* Product card shell */
.product-card {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  height: 100% !important;
  min-width: 0 !important;
  background: #ffffff !important;
  border: 1px solid #e7ebf4 !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 8px rgba(24, 32, 79, 0.04) !important;
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease !important;
  box-sizing: border-box !important;
}
.product-card:hover {
  transform: translateY(-4px) !important;
  border-color: #c7d2fe !important;
  box-shadow: 0 12px 28px rgba(67, 56, 202, 0.12) !important;
}

/* Floating wishlist button in corner */
.product-card .wishlist-icon-button,
.product-card .wishlist-corner-form .wishlist-icon-button,
.product-card .card-actions .wishlist-icon-button {
  position: absolute !important;
  top: 8px !important;
  right: 8px !important;
  left: auto !important;
  bottom: auto !important;
  z-index: 10 !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  max-width: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.94) !important;
  backdrop-filter: blur(4px) !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.10) !important;
  color: #6366f1 !important;
  font-size: 17px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  padding: 0 !important;
  line-height: 1 !important;
  transition: transform 0.18s ease, color 0.18s ease, background 0.18s ease !important;
}
.product-card .wishlist-icon-button:hover {
  transform: scale(1.12) !important;
  color: #ef4444 !important;
  background: #ffffff !important;
  border-color: #fecaca !important;
}
.product-card .wishlist-icon-button.is-active {
  color: #ef4444 !important;
  background: #ffffff !important;
  border-color: #fecaca !important;
}

/* Sale / Discount badge */
.product-card .sale,
.product-card .cover .sale,
.product-card .cover > .sale,
.product-card .cover > span.sale {
  position: absolute !important;
  top: 8px !important;
  left: 8px !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 9 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 3px 8px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  border-radius: 6px !important;
  background: linear-gradient(135deg, #ef4444, #dc2626) !important;
  color: #ffffff !important;
  box-shadow: 0 2px 6px rgba(220, 38, 38, 0.25) !important;
  line-height: 1.2 !important;
}

/* Cover container: fixed elegant height, clean neutral frame */
.product-grid .product-card .cover,
.product-card .cover {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 190px !important;
  min-height: 190px !important;
  max-height: 190px !important;
  aspect-ratio: auto !important;
  padding: 12px 10px 8px !important;
  margin: 0 !important;
  background: #f8fafc !important;
  border-bottom: 1px solid #f1f5f9 !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}
.product-grid .product-card > a,
.product-card > a.cover-link,
.product-card > a:first-child {
  display: block !important;
  width: 100% !important;
  text-decoration: none !important;
}
.product-grid .product-card .cover > a,
.product-card .cover > a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  text-decoration: none !important;
}

/* Cover image: contains the book with realistic drop shadow */
.product-grid .product-card .cover img,
.product-grid .product-card .cover > img,
.product-grid .product-card .cover > a > img,
.product-card .cover img,
.product-card .cover > img,
.product-card .cover > a > img {
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 170px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  object-fit: contain !important;
  object-position: center center !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border-radius: 5px !important;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12), 0 1px 3px rgba(15, 23, 42, 0.08) !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease !important;
  transform: none !important;
}
.product-card:hover .cover img,
.product-card:hover .cover > img,
.product-card:hover .cover > a > img {
  transform: translateY(-2px) scale(1.02) !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.18) !important;
}

/* Product Info */
.product-card .product-info {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 !important;
  padding: 10px 12px 12px !important;
  text-align: center !important;
  background: #ffffff !important;
  box-sizing: border-box !important;
  min-width: 0 !important;
}

/* Title: clamped to 2 lines */
.product-card .product-info h3 {
  margin: 0 0 3px !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  line-height: 1.38 !important;
  color: #1e1b4b !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  box-sizing: border-box !important;
}
.product-card .product-info h3 a {
  color: #1e1b4b !important;
  text-decoration: none !important;
  transition: color 0.18s ease !important;
}
.product-card .product-info h3 a:hover {
  color: #4f46e5 !important;
}

/* Author: 1 line */
.product-card .product-info .author {
  font-size: 11.5px !important;
  color: #64748b !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  height: 17px !important;
  min-height: 17px !important;
  max-height: 17px !important;
  margin: 0 0 6px !important;
  line-height: 17px !important;
}

/* Price */
.product-card .product-info .price {
  display: flex !important;
  align-items: baseline !important;
  justify-content: center !important;
  gap: 6px !important;
  margin: auto 0 10px !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  color: #4338ca !important;
  line-height: 1.2 !important;
}
.product-card .product-info .price s {
  font-size: 12px !important;
  color: #94a3b8 !important;
  font-weight: 400 !important;
  text-decoration: line-through !important;
}

/* Card Actions: Single neat horizontal row */
.product-card .card-actions {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
  width: 100% !important;
  margin-top: auto !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}
.product-card .card-actions form[data-add-cart],
.product-card .card-actions .card-cart-form {
  display: flex !important;
  flex: 1.15 !important;
  margin: 0 !important;
  padding: 0 !important;
  min-width: 0 !important;
}
.product-card .card-actions form[data-add-cart] button.btn,
.product-card .card-actions .btn.btn-cart {
  width: 100% !important;
  height: 33px !important;
  min-height: 33px !important;
  max-height: 33px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 6px 8px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, #4f46e5, #4338ca) !important;
  color: #ffffff !important;
  border: 0 !important;
  cursor: pointer !important;
  box-shadow: 0 2px 6px rgba(79, 70, 229, 0.22) !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease !important;
  white-space: nowrap !important;
  text-decoration: none !important;
}
.product-card .card-actions form[data-add-cart] button.btn:hover,
.product-card .card-actions .btn.btn-cart:hover {
  background: linear-gradient(135deg, #4338ca, #3730a3) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 10px rgba(79, 70, 229, 0.32) !important;
}

/* Secondary Details button */
.product-card .card-actions > a.btn,
.product-card .card-actions .btn.btn-details,
.product-card .card-actions a.btn.dark {
  flex: 0.85 !important;
  height: 33px !important;
  min-height: 33px !important;
  max-height: 33px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 6px 8px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  border-radius: 8px !important;
  background: #f1f5f9 !important;
  color: #334155 !important;
  border: 1px solid #e2e8f0 !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: transform 0.18s ease, background 0.18s ease, color 0.18s ease, border-color 0.18s ease !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  min-width: 0 !important;
}
.product-card .card-actions > a.btn:hover,
.product-card .card-actions .btn.btn-details:hover,
.product-card .card-actions a.btn.dark:hover {
  background: #e2e8f0 !important;
  color: #0f172a !important;
  border-color: #cbd5e1 !important;
  transform: translateY(-1px) !important;
}

/* Hide redundant buy_now button on small thumbnail cards */
.product-card .card-actions form[data-add-cart] button[name="buy_now"] {
  display: none !important;
}

/* Responsive card sizing for tablet and mobile */
@media (max-width: 700px) {
  .product-grid .product-card .cover,
  .product-card .cover {
    height: 155px !important;
    min-height: 155px !important;
    max-height: 155px !important;
    padding: 8px 6px 4px !important;
  }
  .product-grid .product-card .cover img,
  .product-card .cover img {
    max-height: 140px !important;
  }
  .product-card .product-info {
    padding: 8px 8px 10px !important;
  }
  .product-card .product-info h3 {
    font-size: 12px !important;
    height: 34px !important;
    min-height: 34px !important;
    max-height: 34px !important;
  }
  .product-card .product-info .price {
    font-size: 13.5px !important;
    margin-bottom: 8px !important;
  }
  .product-card .card-actions form[data-add-cart] button.btn,
  .product-card .card-actions > a.btn {
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    padding: 4px 6px !important;
    font-size: 11px !important;
  }
}

/* Header alignment tuned to the supplied Ketabika reference screenshot */
@media (min-width: 1101px) {
  .header-row {
    grid-template-columns: minmax(280px, 1.05fr) minmax(220px, 300px) auto !important;
    grid-template-areas: "search logo actions" "nav nav nav" !important;
    column-gap: 24px !important;
    width: calc(100% - 48px) !important;
    max-width: 1440px !important;
    padding-top: 8px !important;
  }
  .search { justify-self: start; width: min(100%, 560px); max-width: 560px !important; }
  .logo { grid-area: logo !important; justify-content: center !important; min-width: 0; }
  .site-logo-image { width: 245px !important; max-width: 100%; object-position: center !important; }
  .header-actions { grid-area: actions !important; justify-content: flex-end !important; gap: 8px !important; }
  .primary-nav {
    width: calc(100% - 0px) !important;
    justify-content: flex-start !important;
    padding: 0 12px !important;
    margin-top: 8px !important;
    direction: rtl;
  }
}
@media (max-width: 1100px) {
  .header-row { grid-template-areas: "logo actions" "search search" "nav nav" !important; }
}


/* HEADER REBUILD v2 — explicit physical layout matching the reference screenshot.
   LTR grid coordinates keep the logo on the left, search centered, actions on right;
   navigation occupies its own full-width row below. */
@media (min-width: 901px) {
  .site-header { border-top: 0 !important; background: #fff !important; }
  .site-header > .container.header-row,
  .site-header .header-row {
    display: grid !important;
    direction: ltr !important;
    grid-template-columns: minmax(190px, 245px) minmax(260px, 1fr) auto !important;
    grid-template-rows: 64px 52px !important;
    grid-template-areas: "logo search actions" "nav nav nav" !important;
    align-items: center !important;
    column-gap: 24px !important;
    row-gap: 0 !important;
    width: min( calc(100% - 48px), 1440px ) !important;
    max-width: 1440px !important;
    margin-inline: auto !important;
    padding: 6px 0 0 !important;
    min-height: 0 !important;
    box-sizing: border-box !important;
  }
  .site-header .header-row > .logo {
    grid-area: logo !important; grid-column: 1 !important; grid-row: 1 !important;
    direction: ltr !important; justify-self: start !important; justify-content: flex-start !important;
    width: 100% !important; min-width: 0 !important; flex: none !important; margin: 0 !important;
  }
  .site-header .header-row > .logo img.site-logo-image {
    display: block !important; width: 190px !important; max-width: 100% !important;
    max-height: 58px !important; height: auto !important; object-fit: contain !important;
  }
  .site-header .header-row > .search {
    grid-area: search !important; grid-column: 2 !important; grid-row: 1 !important;
    direction: rtl !important; justify-self: stretch !important; align-self: center !important;
    width: 100% !important; max-width: 560px !important; min-width: 0 !important;
    margin: 0 !important; flex: none !important;
  }
  .site-header .header-row > .search input { min-width: 0 !important; height: 42px !important; box-sizing: border-box !important; }
  .site-header .header-row > .search button { height: 42px !important; box-sizing: border-box !important; }
  .site-header .header-row > .header-actions {
    grid-area: actions !important; grid-column: 3 !important; grid-row: 1 !important;
    direction: rtl !important; justify-self: end !important; align-self: center !important;
    display: flex !important; flex-wrap: nowrap !important; gap: 8px !important;
    width: max-content !important; max-width: 100% !important; margin: 0 !important;
  }
  .site-header .header-row > nav.primary-nav {
    grid-area: nav !important; grid-column: 1 / -1 !important; grid-row: 2 !important;
    direction: rtl !important; display: flex !important; align-items: center !important;
    justify-content: flex-start !important; width: calc(100% + 48px) !important;
    max-width: none !important; min-width: 0 !important; height: 52px !important; min-height: 52px !important;
    margin: 0 -24px !important; padding: 0 16px !important; box-sizing: border-box !important;
    overflow-x: auto !important; overflow-y: visible !important; white-space: nowrap !important;
    background: linear-gradient(100deg, #3438b9, #4c46e9) !important;
    border: 0 !important; gap: clamp(12px, 1.5vw, 24px) !important;
  }
  .site-header nav.primary-nav > a,
  .site-header nav.primary-nav .nav-main-link { color: #fff !important; font-weight: 700 !important; }
  .site-header nav.primary-nav .nav-chevron { color: #dfe2ff !important; }
}
@media (max-width: 900px) {
  .site-header .header-row { display: grid !important; direction: rtl !important; grid-template-columns: minmax(0,1fr) auto !important; grid-template-areas: "logo actions" "search search" "nav nav" !important; gap: 8px 10px !important; padding-top: 8px !important; }
  .site-header .header-row > .logo { grid-area: logo !important; grid-column: 1 !important; grid-row: 1 !important; justify-self: start !important; }
  .site-header .header-row > .header-actions { grid-area: actions !important; grid-column: 2 !important; grid-row: 1 !important; justify-self: end !important; }
  .site-header .header-row > .search { grid-area: search !important; grid-column: 1 / -1 !important; grid-row: 2 !important; width: 100% !important; max-width: none !important; margin: 0 !important; }
  .site-header .header-row > nav.primary-nav { grid-area: nav !important; grid-column: 1 / -1 !important; grid-row: 3 !important; width: 100% !important; margin: 0 !important; background: linear-gradient(100deg,#3438b9,#4c46e9) !important; }
  .site-header nav.primary-nav > a, .site-header nav.primary-nav .nav-main-link { color:#fff !important; }
}

/* Header account + wishlist arrangement update */
.site-header .header-actions{direction:rtl;display:flex;align-items:center;justify-content:flex-start;gap:10px;}
.site-header .header-login-link{order:1;}
.site-header .header-favorite-link{order:2;}
.site-header .header-cart-link{order:3;}
.site-header .header-favorite-link .header-action-icon{font-family:Arial,sans-serif;font-size:25px;line-height:1;color:#4c43df;}
.site-header .header-login-link .header-account-avatar{width:30px;height:30px;min-width:30px;border-radius:50%;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;padding:0;background:#ecebff;color:#403bb4;font-weight:800;}
.site-header .header-login-link .header-account-avatar img{display:block;width:100%;height:100%;object-fit:cover;}
.site-header .header-account-name{max-width:105px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
@media(max-width:900px){.site-header .header-actions{gap:5px}.site-header .header-action-link{gap:5px;padding:7px 8px}.site-header .header-account-name{max-width:70px}}


/* Final homepage promo hero override: this stylesheet loads after store.css. */
body .hero.ketabika-promo-hero {
  display:block !important; position:relative !important; isolation:isolate !important;
  overflow:hidden !important; min-height:310px !important; padding:0 !important;
  color:#30349f !important;
  background:linear-gradient(105deg,#d9dcff 0%,#f5f6ff 54%,#e7eaff 100%) !important;
  border-top:1px solid #dfe1ff !important; border-bottom:1px solid #dfe1ff !important;
}
body .hero.ketabika-promo-hero .promo-hero-inner {
  position:relative !important; display:grid !important;
  grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr) !important;
  align-items:center !important; gap:28px !important; min-height:310px !important;
  padding-top:20px !important; padding-bottom:20px !important;
}
body .hero.ketabika-promo-hero .promo-book-art {
  display:flex !important; position:relative !important; visibility:visible !important;
  opacity:1 !important; height:265px !important; min-width:0 !important;
  overflow:hidden !important; border-radius:0 48% 48% 0 !important;
  background:radial-gradient(ellipse at 65% 80%,#b8baff 0,transparent 45%),linear-gradient(100deg,#6668df,#b8baff 54%,#e4e5ff) !important;
  align-items:flex-end !important; padding:0 8% 22px !important; gap:7px !important;
}
body .hero.ketabika-promo-hero .promo-book {display:block !important;visibility:visible !important;opacity:1 !important;position:relative !important;height:65px;border-radius:4px 5px 2px 2px;box-shadow:0 10px 18px #25228c40;border-bottom:7px solid #292a9f;}
body .hero.ketabika-promo-hero .promo-open-book, body .hero.ketabika-promo-hero .promo-mug, body .hero.ketabika-promo-hero .promo-plant {display:block !important;visibility:visible !important;opacity:1 !important;}
body .hero.ketabika-promo-hero .promo-hero-copy {position:relative !important;z-index:2 !important;text-align:right !important;padding:10px 5% 10px 0 !important;color:#30349f !important;}
body .hero.ketabika-promo-hero .promo-hero-copy h1 {color:#30349f !important;text-shadow:none !important;}
body .hero.ketabika-promo-hero .promo-hero-copy p {color:#6669bf !important;}
body .hero.ketabika-promo-hero .promo-eyebrow {color:#5354d7 !important;}
body .hero.ketabika-promo-hero .promo-line-art {color:#a4a6ff !important;}
@media(max-width:700px){
 body .hero.ketabika-promo-hero .promo-hero-inner{grid-template-columns:1fr !important;gap:0 !important;padding:0 0 22px !important;}
 body .hero.ketabika-promo-hero .promo-book-art{order:2 !important;height:155px !important;border-radius:0 0 35% 0 !important;padding-bottom:10px !important;}
 body .hero.ketabika-promo-hero .promo-hero-copy{order:1 !important;text-align:center !important;padding:26px 12px 12px !important;}
 body .hero.ketabika-promo-hero .promo-hero-copy h1{font-size:30px !important;}
 body .hero.ketabika-promo-hero .promo-line-art{display:none !important;}
}


/* Ketabika: use the supplied real banner artwork as the hero background. */
body .hero.ketabika-promo-hero {
  background-image: url('../images/ketabika-hero-background.png?v=20261009-user-banner') !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: cover !important;
  background-color: #f4f5ff !important;
  min-height: clamp(260px, 31vw, 460px) !important;
}
body .hero.ketabika-promo-hero .promo-hero-inner {
  min-height: clamp(260px, 31vw, 460px) !important;
  grid-template-columns: minmax(0, 1fr) minmax(360px, .9fr) !important;
  background: transparent !important;
}
body .hero.ketabika-promo-hero .promo-book-art,
body .hero.ketabika-promo-hero .promo-line-art {
  display: none !important;
}
body .hero.ketabika-promo-hero .promo-hero-copy {
  grid-column: 2 !important;
  justify-self: end !important;
  max-width: 560px !important;
  padding: 24px 3% 24px 0 !important;
  background: transparent !important;
}
body .hero.ketabika-promo-hero .promo-shop-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-top: 14px !important;
  padding: 12px 25px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg,#5148e8,#6d63ff) !important;
  color: #fff !important;
  text-decoration: none !important;
  box-shadow: 0 8px 20px #5148e833 !important;
}
@media(max-width:700px) {
  body .hero.ketabika-promo-hero {
    background-position: 32% center !important;
    background-size: cover !important;
  }
  body .hero.ketabika-promo-hero .promo-hero-inner {
    display: flex !important;
    justify-content: center !important;
    min-height: 300px !important;
    background: #f4f5ff99 !important;
  }
  body .hero.ketabika-promo-hero .promo-hero-copy {
    grid-column: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 26px 18px !important;
    text-align: center !important;
    background: #f4f5ffb8 !important;
  }
  body .hero.ketabika-promo-hero .promo-hero-copy h1 { font-size: 30px !important; }
}

/* FINAL HERO POSITION FIX: keep all copy on the bright/right side of the supplied banner. */
body .hero.ketabika-promo-hero{background-position:center center!important;background-size:cover!important;}
body .hero.ketabika-promo-hero .promo-hero-inner{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;align-items:center!important;position:relative!important;width:min(100%,1440px)!important;margin-inline:auto!important;padding:28px clamp(24px,5vw,80px)!important;}
body .hero.ketabika-promo-hero .promo-book-art,body .hero.ketabika-promo-hero .promo-line-art{display:none!important;}
body .hero.ketabika-promo-hero .promo-hero-copy{grid-column:2!important;grid-row:1!important;justify-self:stretch!important;align-self:center!important;width:100%!important;max-width:650px!important;margin-inline-start:auto!important;margin-inline-end:0!important;padding:24px 0 24px 5%!important;text-align:right!important;background:transparent!important;position:relative!important;z-index:3!important;}
body .hero.ketabika-promo-hero .promo-hero-copy h1{color:#30349f!important;text-shadow:0 1px 8px rgba(255,255,255,.7)!important;}
body .hero.ketabika-promo-hero .promo-hero-copy p{color:#4147a6!important;text-shadow:0 1px 8px rgba(255,255,255,.75)!important;}
body .hero.ketabika-promo-hero .promo-eyebrow{color:#4c4bc8!important;}
@media(max-width:700px){body .hero.ketabika-promo-hero{background-position:38% center!important;}body .hero.ketabika-promo-hero .promo-hero-inner{display:flex!important;justify-content:flex-end!important;padding:22px 16px!important;background:transparent!important;}body .hero.ketabika-promo-hero .promo-hero-copy{width:54%!important;max-width:54%!important;padding:18px 0!important;text-align:right!important;background:rgba(248,248,255,.45)!important;border-radius:12px!important;}body .hero.ketabika-promo-hero .promo-hero-copy h1{font-size:clamp(22px,6vw,30px)!important;}body .hero.ketabika-promo-hero .promo-hero-copy p{font-size:12px!important;line-height:1.7!important;}body .hero.ketabika-promo-hero .promo-shop-btn{padding:9px 13px!important;font-size:12px!important;}}


/* VERIFIED DESKTOP HERO ALIGNMENT: reserve the left half for the books and put all text in the clean light area on the right. */
@media (min-width: 701px) {
  html body section.hero.ketabika-promo-hero > .container.promo-hero-inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    width: 100% !important;
    max-width: 1440px !important;
    margin: 0 auto !important;
    padding: 28px clamp(24px, 4vw, 64px) !important;
    box-sizing: border-box !important;
  }
  html body section.hero.ketabika-promo-hero > .container.promo-hero-inner > .promo-hero-copy {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: stretch !important;
    align-self: center !important;
    width: 100% !important;
    max-width: 620px !important;
    margin: 0 0 0 auto !important;
    padding: 24px 10px 24px 24px !important;
    transform: none !important;
    position: relative !important;
    inset: auto !important;
    text-align: right !important;
    background: transparent !important;
    z-index: 5 !important;
  }
}
@media (max-width: 700px) {
  html body section.hero.ketabika-promo-hero > .container.promo-hero-inner > .promo-hero-copy {
    transform: none !important;
    width: min(100%, 520px) !important;
    max-width: 100% !important;
    margin: 0 auto !important;
  }
}


/* HERO FINAL GEOMETRY FIX: place copy in the actual blank band of the background image.
   The document is RTL, so grid-column numbering was putting the copy on the wrong side.
   Use absolute positioning relative to the full hero instead of grid columns. */
@media (min-width: 701px) {
  html body section.hero.ketabika-promo-hero {
    position: relative !important;
    overflow: hidden !important;
    background-position: center center !important;
    background-size: 100% 100% !important;
  }
  html body section.hero.ketabika-promo-hero > .container.promo-hero-inner {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    max-width: none !important;
    min-height: clamp(300px, 32vw, 470px) !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  html body section.hero.ketabika-promo-hero > .container.promo-hero-inner > .promo-hero-copy {
    position: absolute !important;
    top: 50% !important;
    right: 23% !important;
    left: auto !important;
    transform: translateY(-50%) !important;
    width: 29% !important;
    max-width: 560px !important;
    min-width: 390px !important;
    margin: 0 !important;
    padding: 18px 0 !important;
    text-align: right !important;
    background: transparent !important;
    z-index: 10 !important;
  }
}
@media (max-width: 700px) {
  html body section.hero.ketabika-promo-hero > .container.promo-hero-inner > .promo-hero-copy {
    position: relative !important;
    top: auto !important; right: auto !important; left: auto !important;
    transform: none !important;
    width: 100% !important; min-width: 0 !important; max-width: 100% !important;
    margin: 0 auto !important;
  }
}


/* FINAL OVERRIDES: true full-width header and reliable hover dropdowns */
html, body { width:100%; max-width:100%; margin:0; overflow-x:clip; }
.site-header { width:100%; max-width:none; overflow:visible !important; position:sticky; top:0; z-index:5000 !important; }
.site-header > .container.header-row,
.site-header .header-row {
  width:100% !important; max-width:none !important; box-sizing:border-box !important;
  margin:0 !important; padding-left:clamp(16px, 4vw, 64px) !important;
  padding-right:clamp(16px, 4vw, 64px) !important; overflow:visible !important;
}
.site-header .header-row { position:relative; }
.site-header .header-row > nav.primary-nav {
  width:100vw !important; max-width:none !important; box-sizing:border-box !important;
  margin-left:calc(50% - 50vw) !important; margin-right:calc(50% - 50vw) !important;
  padding-left:clamp(16px, 4vw, 64px) !important; padding-right:clamp(16px, 4vw, 64px) !important;
  overflow:visible !important; overflow-x:visible !important; overflow-y:visible !important;
  position:relative !important; z-index:5001 !important; isolation:auto !important;
  flex-wrap:nowrap !important;
}
.site-header nav.primary-nav .nav-item { position:relative !important; overflow:visible !important; }
.site-header nav.primary-nav .nav-item.has-submenu > .nav-main-link { position:relative; }
.site-header nav.primary-nav .nav-item.has-submenu > .nav-submenu {
  display:none !important; visibility:hidden !important; opacity:0 !important;
  pointer-events:none !important; position:absolute !important; top:100% !important;
  right:0 !important; left:auto !important; bottom:auto !important;
  transform:none !important; width:max-content !important; min-width:220px !important;
  max-width:min(340px, calc(100vw - 24px)) !important; max-height:65vh !important;
  overflow-y:auto !important; box-sizing:border-box !important; margin:0 !important;
  padding:8px !important; background:#fff !important; color:#202536 !important;
  border:1px solid #e1e4f5 !important; border-radius:12px !important;
  box-shadow:0 14px 36px rgba(20,25,60,.22) !important; z-index:100000 !important;
}
.site-header nav.primary-nav .nav-item.has-submenu:hover > .nav-submenu,
.site-header nav.primary-nav .nav-item.has-submenu:focus-within > .nav-submenu,
.site-header nav.primary-nav .nav-item.has-submenu:focus > .nav-submenu {
  display:block !important; visibility:visible !important; opacity:1 !important;
  pointer-events:auto !important;
}
.site-header nav.primary-nav .nav-submenu a {
  display:block !important; width:100% !important; box-sizing:border-box !important;
  padding:10px 12px !important; color:#252e8f !important; text-decoration:none !important;
  white-space:normal !important; border-radius:8px !important; transform:none !important;
}
.site-header nav.primary-nav .nav-submenu a:hover,
.site-header nav.primary-nav .nav-submenu a:focus { background:#f0f1ff !important; }
@media (max-width:760px) {
 .site-header > .container.header-row, .site-header .header-row { padding-left:12px !important; padding-right:12px !important; }
 .site-header .header-row > nav.primary-nav { width:100vw !important; margin-left:calc(50% - 50vw) !important; margin-right:calc(50% - 50vw) !important; }
 .site-header nav.primary-nav .nav-item.has-submenu > .nav-submenu { max-width:calc(100vw - 24px) !important; }
}


/* Final header width + dropdown interaction fix */
html, body { max-width:100%; }
.site-header {
 width:100% !important; max-width:none !important; box-sizing:border-box !important;
 margin-left:calc(50% - 50vw) !important; margin-right:calc(50% - 50vw) !important;
 position:relative !important; z-index:9000 !important; overflow:visible !important;
}
.site-header > .container.header-row, .site-header .header-row {
 width:100% !important; max-width:none !important; box-sizing:border-box !important;
 margin-left:0 !important; margin-right:0 !important;
 padding-left:clamp(14px,2vw,32px) !important; padding-right:clamp(14px,2vw,32px) !important;
}
.site-header nav.primary-nav {
 width:100% !important; max-width:none !important; box-sizing:border-box !important;
 position:relative !important; overflow:visible !important; z-index:9001 !important;
}
.site-header nav.primary-nav .nav-item { position:relative !important; overflow:visible !important; }
.site-header nav.primary-nav .nav-item.has-submenu > .nav-submenu {
 display:none; visibility:hidden; opacity:0; pointer-events:none;
 position:absolute !important; top:100% !important; right:0 !important; left:auto !important;
 min-width:220px; width:max-content; max-width:min(90vw,360px);
 z-index:99999 !important; background:#fff !important; box-shadow:0 12px 30px rgba(0,0,0,.16) !important;
 border:1px solid #eee; border-radius:10px; padding:8px; overflow:visible;
}
.site-header nav.primary-nav .nav-item.has-submenu:hover > .nav-submenu,
.site-header nav.primary-nav .nav-item.has-submenu:focus-within > .nav-submenu,
.site-header nav.primary-nav .nav-item.has-submenu.submenu-open > .nav-submenu {
 display:block !important; visibility:visible !important; opacity:1 !important; pointer-events:auto !important;
}
.site-header nav.primary-nav .nav-submenu a { display:block !important; white-space:nowrap; padding:10px 14px; }
@media(max-width:760px) {
 .site-header > .container.header-row, .site-header .header-row {padding-left:10px !important;padding-right:10px !important;}
 .site-header nav.primary-nav .nav-item.has-submenu > .nav-submenu {position:absolute !important;max-width:calc(100vw - 24px) !important;white-space:normal;}
 .site-header nav.primary-nav .nav-submenu a {white-space:normal;}
}

/* Hero copy: nudge the text block slightly left on desktop as requested. */
@media (min-width: 701px) {
  html body section.hero.ketabika-promo-hero > .container.promo-hero-inner > .promo-hero-copy {
    transform: translate(-35px, -50%) !important;
  }
}

/* Wishlist heart: toggle in place without leaving the catalog */
.wishlist-icon-button{transition:background .18s ease,color .18s ease,transform .18s ease}
.wishlist-icon-button.is-active{background:#5148ed!important;color:#fff!important;border-color:#5148ed!important}
.wishlist-icon-button:active{transform:scale(.92)}
.wishlist-icon-button:disabled{opacity:.7;cursor:wait}

/* Search dropdown fix: never clip autocomplete results inside the header search form. */
.site-header .search{overflow:visible!important;position:relative!important;z-index:10000!important}
.site-header .search-suggestions{display:none;position:absolute!important;top:calc(100% + 8px)!important;left:0!important;right:0!important;width:100%!important;max-height:min(390px,70vh)!important;overflow-y:auto!important;overflow-x:hidden!important;z-index:10001!important;background:#fff!important}
.site-header .header-row{overflow:visible!important}

/* Definitive autocomplete visibility fix */
.site-header, .site-header .header-row { overflow: visible !important; }
.site-header form.search { position: relative !important; overflow: visible !important; z-index: 10020 !important; }
.site-header form.search .search-suggestions { display: none; position: absolute !important; top: calc(100% + 6px) !important; left: 0 !important; right: 0 !important; width: 100% !important; max-height: min(390px, 70vh) !important; overflow-y: auto !important; overflow-x: hidden !important; z-index: 10030 !important; background: #fff !important; border: 1px solid #dedcff !important; border-radius: 12px !important; box-shadow: 0 18px 45px rgba(31,30,74,.22) !important; }
.search-suggestion-message { padding: 14px; color: #4b4a83; text-align: center; font-size: 13px; background: #fff; }


/* Login page: supplied floating-books artwork on the purple side card. */
body .auth-section .auth-shell .auth-side {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  background-color: #34328f !important;
  background-image: linear-gradient(180deg, rgba(28, 24, 120, .12), rgba(48, 35, 190, .18)), url("../images/login-books-background.png") !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: cover !important;
}
body .auth-section .auth-shell .auth-side > * { position: relative; z-index: 1; }

/* ==========================================================================
   FOOTER CONTACT & SOCIAL MEDIA ICONS
   ========================================================================== */
.footer-contact-info {
  margin-bottom: 12px;
}
.footer-email-link {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  color: #dce2ef !important;
  font-size: 13px !important;
  text-decoration: none !important;
  word-break: break-all;
  transition: color 0.2s ease;
}
.footer-email-link:hover {
  color: #ffffff !important;
}
.footer-email-link svg {
  flex-shrink: 0;
  color: #a5b4fc;
}
.footer-social-icons {
  display: flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 8px;
}
.social-icon-btn {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
  text-decoration: none !important;
  transition: transform 0.2s ease, background 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
}
.social-icon-btn:hover {
  transform: translateY(-3px) scale(1.05) !important;
  color: #ffffff !important;
}
.social-icon-btn.facebook:hover {
  background: #1877f2 !important;
  border-color: #1877f2 !important;
  box-shadow: 0 4px 14px rgba(24, 119, 242, 0.45) !important;
}
.social-icon-btn.instagram:hover {
  background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%) !important;
  border-color: #d6249f !important;
  box-shadow: 0 4px 14px rgba(214, 36, 159, 0.45) !important;
}
.social-icon-btn.tiktok:hover {
  background: #000000 !important;
  border-color: #333333 !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.6) !important;
}
.social-icon-btn.whatsapp:hover {
  background: #25d366 !important;
  border-color: #25d366 !important;
  box-shadow: 0 4px 14px rgba(37, 211, 102, 0.45) !important;
}
.social-icon-btn.email:hover {
  background: #ea4335 !important;
  border-color: #ea4335 !important;
  box-shadow: 0 4px 14px rgba(234, 67, 53, 0.45) !important;
}
.social-badge {
  position: absolute !important;
  bottom: -4px !important;
  right: -4px !important;
  left: auto !important;
  background: #22c55e !important;
  color: #ffffff !important;
  font-size: 8.5px !important;
  font-weight: 800 !important;
  padding: 1px 4px !important;
  border-radius: 4px !important;
  line-height: 1.1 !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35) !important;
  border: 1px solid rgba(255, 255, 255, 0.6) !important;
}
.social-icon-btn.whatsapp-en .social-badge {
  background: #0284c7 !important;
}

/* Contact page cards */
.contact-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
  gap: 20px !important;
  margin-top: 25px !important;
}
.contact-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  padding: 24px 20px !important;
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.05) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease !important;
}
.contact-card:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 12px 28px rgba(79, 70, 229, 0.12) !important;
  border-color: #c7d2fe !important;
}
.contact-card .contact-symbol {
  width: 52px !important;
  height: 52px !important;
  border-radius: 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 24px !important;
  margin-bottom: 12px !important;
}
.contact-card.email .contact-symbol { background: #fee2e2; color: #ef4444; }
.contact-card.whatsapp-ar .contact-symbol { background: #dcfce7; color: #16a34a; }
.contact-card.whatsapp-en .contact-symbol { background: #e0f2fe; color: #0284c7; }
.contact-card.tiktok .contact-symbol { background: #f1f5f9; color: #0f172a; }
.contact-card.instagram .contact-symbol { background: #fdf2f8; color: #db2777; }
.contact-card.facebook .contact-symbol { background: #eff6ff; color: #2563eb; }
.contact-card h2 {
  font-size: 16px !important;
  margin: 0 0 6px !important;
  color: #1e1b4b !important;
}
.contact-card p {
  font-size: 13px !important;
  color: #64748b !important;
  margin: 0 0 14px !important;
}
.contact-card .contact-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 10px 18px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  border-radius: 10px !important;
  text-decoration: none !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease !important;
  margin-top: auto !important;
  width: 100% !important;
  max-width: 240px !important;
}
.contact-card.email .contact-btn {
  background: #ea4335 !important;
  color: #fff !important;
  box-shadow: 0 3px 10px rgba(234, 67, 53, 0.25) !important;
}
.contact-card.whatsapp-ar .contact-btn {
  background: #25d366 !important;
  color: #fff !important;
  box-shadow: 0 3px 10px rgba(37, 211, 102, 0.25) !important;
}
.contact-card.whatsapp-en .contact-btn {
  background: #0284c7 !important;
  color: #fff !important;
  box-shadow: 0 3px 10px rgba(2, 132, 199, 0.25) !important;
}
.contact-card.tiktok .contact-btn {
  background: #000000 !important;
  color: #fff !important;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.25) !important;
}
.contact-card.instagram .contact-btn {
  background: linear-gradient(45deg, #f09433, #dc2743, #bc1888) !important;
  color: #fff !important;
  box-shadow: 0 3px 10px rgba(220, 39, 67, 0.25) !important;
}
.contact-card.facebook .contact-btn {
  background: #1877f2 !important;
  color: #fff !important;
  box-shadow: 0 3px 10px rgba(24, 119, 242, 0.25) !important;
}



/* MOBILE LAYOUT ROOT FIX v3
   The desktop full-bleed navigation used 100vw plus negative margins. On narrow
   viewports this can create horizontal displacement, especially in RTL layouts.
   Restore the navigation to the header flow on phones and constrain common children. */
@media (max-width: 760px) {
  html, body {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }
  *, *::before, *::after { box-sizing: border-box; }
  img, video, iframe, canvas, svg { max-width: 100%; }
  .container, .site-header, main, footer, .section, .hero,
  .site-header .header-row {
    max-width: 100% !important;
    min-width: 0 !important;
  }
  .site-header .header-row > nav.primary-nav,
  .site-header nav.primary-nav {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    -webkit-overflow-scrolling: touch;
  }
  .site-header nav.primary-nav .nav-item,
  .site-header nav.primary-nav > a,
  .site-header nav.primary-nav .nav-main-link {
    flex: 0 0 auto !important;
    max-width: calc(100vw - 24px) !important;
  }
  .site-header nav.primary-nav .nav-submenu {
    max-width: calc(100vw - 24px) !important;
    box-sizing: border-box !important;
  }
  .product-grid, .category-grid, .footer-grid, .detail-grid,
  .hero-grid, .form-grid, .meta-list {
    min-width: 0 !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .detail-grid, .hero-grid, .form-grid { grid-template-columns: minmax(0, 1fr) !important; }
  .product-card, .product-info, .category-tile, .section,
  .section-head, .latest-slide-inner, .latest-copy {
    min-width: 0 !important;
    max-width: 100% !important;
  }
  .product-card img, .cover img, .detail-cover img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    object-fit: contain;
  }
  .section-head { flex-wrap: wrap !important; gap: 8px !important; }
  .footer-grid { grid-template-columns: minmax(0, 1fr) !important; }
  input, select, textarea, button { max-width: 100%; }
  pre, table { max-width: 100%; }
  .table-wrap, .cart-table-wrap { max-width: 100%; overflow-x: auto; }
}
