@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=Barlow:wght@400;500;600;700;800&display=swap'); /* Design tokens live in /tokens.css (linked before this file on every page). */ *{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:138px}body{margin:0;color:var(--ink);font-family:Barlow,Arial,sans-serif;background:var(--color-surface)}button,input,select{font:inherit}a{color:inherit;text-decoration:none}button{color:inherit;cursor:pointer}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}button{border:0;background:none}a,button{touch-action:manipulation}button:disabled{cursor:wait;opacity:.6}img{max-width:100%;height:auto;display:block}svg.icon{width:20px;height:20px;flex-shrink:0;display:inline-block;vertical-align:middle;stroke:currentColor;stroke-width:1.65;fill:none;stroke-linecap:round;stroke-linejoin:round}.wrap{width:min(1376px,calc(100% - 96px));margin:auto}.skip{position:fixed;top:-80px;left:10px;background:var(--color-surface);padding:16px;z-index:100}.skip:focus{top:10px}:focus-visible{outline:3px solid var(--color-accent-strong);outline-offset:4px}.announcement{min-height:32px;background:var(--color-primary);color:var(--color-white);display:flex;justify-content:space-between;padding:7px 48px;font-size:10px;font-weight:600;letter-spacing:1.3px}.announcement>span:last-child{display:flex;align-items:center;gap:9px;letter-spacing:.3px}.announcement .icon{width:15px;height:15px}.announcement b{margin-left:12px}.site-header{position:sticky;top:0;background:rgb(var(--rgb-white) / .98);z-index:20;border-bottom:1px solid var(--line)}.header-main{height:91px;display:flex;align-items:center;gap:26px}.brand{display:flex;align-items:center;gap:12px;font-size:22px;font-weight:800;letter-spacing:-.8px;line-height:.9;flex-shrink:0}.brand small{font-size:22px;display:block;letter-spacing:4px;margin-top:6px}.brand-mark{display:block;width:37px;height:43px;position:relative}.brand-mark i{position:absolute;display:block;inset:5px 6px;border:3px solid var(--color-accent-strong);border-radius:3px;transform:rotate(-18deg)}.brand-mark i:nth-child(2){transform:rotate(0)}.brand-mark i:nth-child(3){transform:rotate(18deg);background:var(--color-accent-strong)}.brand-mark i:nth-child(3):after{content:'M';color:var(--color-white);position:absolute;font-size:16px;top:9px;left:2px}.search{margin-left:42px;display:flex;align-items:center;gap:13px;background:var(--color-surface-sunken);border:1px solid var(--color-border);height:44px;padding:0 15px;max-width:580px;flex:1}.search input{border:0;background:none;outline:0;width:100%;font-size:13px;min-width:0}.search kbd{color:var(--color-subtle)}.icon-button{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;flex-shrink:0}.icon-button:hover{background:var(--color-surface-sunken)}.favorite-nav{position:relative;margin-left:auto}.favorite-nav span{font-size:10px;position:absolute;top:0;right:0;background:var(--ink);color:var(--color-white);min-width:16px;padding:2px;border-radius:50%}.contact-head{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:600;border-left:1px solid var(--color-border);padding-left:24px}.contact-head .icon:last-child{width:16px}.header-nav{display:flex;align-items:center;gap:29px;height:47px;font-size:12px;font-weight:600}.header-nav>a{height:100%;display:flex;align-items:center;position:relative;white-space:nowrap}.header-nav>a:hover:after,.header-nav .active:after{position:absolute;content:'';height:3px;background:var(--color-accent-strong);bottom:0;left:0;right:0}.nav-location{margin-left:auto;display:flex;align-items:center;gap:7px;color:var(--color-muted);font-size:11px;font-weight:400}.nav-location .icon{width:14px}.mobile-search{display:none}.hero{position:relative;background:var(--color-primary);color:var(--color-white);overflow:hidden}.hero-grid{position:absolute;inset:0;background:linear-gradient(90deg,transparent 99.7%,rgb(var(--rgb-white) / .03) 100%),linear-gradient(0deg,transparent 99.7%,rgb(var(--rgb-white) / .03) 100%);background-size:72px 72px;mask-image:linear-gradient(90deg,transparent,#000)}.hero-content{display:grid;grid-template-columns:1fr 1fr;position:relative;min-height:615px}.hero-copy{padding:55px 0 30px;z-index:2}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700;margin:0 0 17px;display:flex;align-items:center;gap:8px}.red-dot,.green-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--color-accent-strong);flex-shrink:0}.green-dot{background:var(--color-success)}.hero .eyebrow{color:var(--color-on-dark-muted);font-size:10px}.hero h1{font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;font-size:clamp(62px,6.6vw,99px);font-weight:800;line-height:.91;letter-spacing:-1.5px;margin:0 0 24px}.hero h1 em{color:var(--color-accent-strong);font-style:italic}.hero-description{color:var(--color-on-dark-muted);font-size:14px;line-height:1.65;margin:0 0 27px}.button{display:inline-flex;align-items:center;justify-content:center;gap:22px;padding:16px 22px;min-height:48px;font-weight:600;font-size:13px;border:1px solid transparent;transition:background .2s,transform .2s}.button:hover{transform:translateY(-2px)}.button-red{background:var(--color-accent-strong);color:var(--color-white)}.button-red:hover{background:var(--color-secondary)}.button-black{background:var(--color-primary);color:var(--color-white)}.button-black:hover{background:var(--color-secondary)}.button-white{background:var(--color-surface);color:var(--color-text)}.button-outline{border-color:var(--color-border-strong);background:var(--color-surface)}.hero-secondary{display:block;font-size:11px;color:var(--color-on-dark-muted);margin-top:16px}.hero-secondary span{color:var(--color-on-dark-muted);margin-left:4px}.hero-meta{display:flex;gap:24px;font-size:10px;color:var(--color-on-dark-muted);margin-top:29px}.hero-meta span{display:flex;align-items:center;gap:6px}.hero-meta .icon{width:14px;height:14px}.hero-art{position:relative;min-width:0;isolation:isolate}.hero-art:before{content:'';position:absolute;width:680px;height:680px;top:-10px;left:-20px;background:radial-gradient(circle,rgb(var(--rgb-accent) / .31),transparent 65%);z-index:-1}.hero-card{position:absolute;top:130px;width:230px;border:7px solid var(--color-line-dark);border-radius:14px;box-shadow:0 30px 60px rgb(var(--rgb-shadow) / .47)}.card-back-left{left:10px;transform:rotate(-20deg);animation:float-left 7s ease-in-out infinite}.card-back-right{right:-8px;transform:rotate(18deg);animation:float-right 8s ease-in-out infinite}.hero-front{position:absolute;left:50%;top:66px;width:272px;padding:7px;border-radius:14px;background:linear-gradient(145deg,var(--color-surface-sunken),var(--color-subtle) 25%,var(--color-surface-sunken) 65%,var(--color-subtle));transform:translateX(-50%) rotate(1deg);box-shadow:0 28px 60px rgb(var(--rgb-shadow) / .6);overflow:hidden;animation:float-front 6s ease-in-out infinite}.hero-front img{border-radius:8px;width:100%;aspect-ratio:524/733;object-fit:cover}.holo-sheen{position:absolute;inset:-30%;background:linear-gradient(110deg,transparent 35%,rgb(var(--rgb-white) / .2) 45%,transparent 55%);transform:translateX(-100%);animation:sheen 9s infinite;pointer-events:none}.floating-tag{position:absolute;bottom:70px;left:50%;transform:translateX(-50%) rotate(-3deg);padding:14px 17px;background:var(--color-surface);color:var(--color-secondary);box-shadow:0 8px 30px rgb(var(--rgb-shadow) / .33);font-size:10px;font-weight:800;display:flex;align-items:center;gap:11px;white-space:nowrap}.floating-tag .icon{width:14px}.art-label{position:absolute;right:8px;top:38px;writing-mode:vertical-rl;font-size:9px;letter-spacing:3px;color:var(--color-on-dark-subtle)}.hero-seal{position:absolute;bottom:36px;right:0;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(12deg);width:104px;height:104px;border:1px solid rgb(var(--rgb-highlight) / .3);border-radius:50%;color:var(--color-on-dark-muted)}.hero-seal span{font-size:8px;letter-spacing:1px}.hero-seal strong{font-family:'Barlow Condensed',Impact,sans-serif;font-size:29px;color:var(--color-white)}.orbit{position:absolute;border:1px solid rgb(var(--rgb-highlight) / .06);border-radius:50%;width:440px;height:440px;left:50%;top:50%;transform:translate(-50%,-50%)}.orbit-two{width:570px;height:570px}.spark{position:absolute;color:var(--color-highlight);animation:twinkle 3s ease-in-out infinite}.spark-one{left:20px;top:55px;font-size:36px}.spark-two{right:6px;top:90px;font-size:46px;animation-delay:1s}.spark-three{left:65px;bottom:94px;font-size:30px}.hero-bottom{height:54px;border-top:1px solid rgb(var(--rgb-highlight) / .09);display:flex;justify-content:space-between;align-items:center;color:var(--color-on-dark-subtle);font-size:9px;letter-spacing:1.5px;position:relative}.hero-bottom b{margin:0 11px;color:var(--color-secondary)}.down-arrow{display:inline-block;margin-left:13px;animation:bob 2s infinite}.ticker{overflow:hidden;background:var(--color-accent-strong);color:var(--color-white);height:38px;display:flex;align-items:center}.ticker>div{display:flex;align-items:center;gap:39px;white-space:nowrap;font-family:'Barlow Condensed',Impact,sans-serif;font-weight:700;font-size:16px;letter-spacing:1.4px;animation:ticker 38s linear infinite}.ticker span{font-size:22px}.section-space{padding-top:67px;padding-bottom:67px}.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:31px}h2{font-size:34px;line-height:1.1;letter-spacing:-1.2px;margin:0;font-weight:700}.section-head .eyebrow{color:var(--color-muted);font-size:9px;margin-bottom:11px}.red-text{color:var(--color-accent-strong)}.text-link{display:inline-flex;align-items:center;gap:10px;font-size:12px;font-weight:600}.text-link:hover{color:var(--color-accent-strong)}.text-link .icon{width:17px}.featured-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.feature-tile{position:relative;min-height:270px;text-align:left;overflow:hidden;display:flex;padding:30px;align-items:center}.electric{background:var(--color-warning-bg)}.legends{background:var(--color-surface-sunken)}.feature-copy{position:relative;z-index:2;width:60%}.pill{font-size:8px;letter-spacing:1px;padding:6px 8px;font-weight:700;display:inline-block}.dark-pill{background:var(--color-primary);color:var(--color-white)}.light-pill{border:1px solid var(--color-border-strong)}.feature-tile h3{font-family:'Barlow Condensed',Impact,sans-serif;font-size:31px;line-height:1.05;margin:16px 0 25px;font-weight:700}.feature-link{font-size:11px;font-weight:600;display:flex;align-items:center;gap:13px}.feature-image{width:160px;position:absolute;right:26px;top:23px;transform:rotate(12deg);transition:transform .35s;filter:drop-shadow(5px 9px 5px rgb(var(--rgb-shadow) / .2));z-index:1}.legends .feature-image{transform:rotate(-9deg);right:30px}.feature-tile:hover .feature-image{transform:rotate(0) translateY(-6px)}.feature-image img{border-radius:8px;width:100%}.electric-bolt{font-size:280px;position:absolute;right:8px;top:-30px;color:rgb(var(--rgb-accent) / .29);z-index:0}.catalog{background:var(--color-background);border-top:1px solid var(--line);scroll-margin-top:0}.catalog-note{font-size:10px;color:var(--color-muted);display:flex;align-items:center;gap:6px;padding-bottom:5px}.catalog-tabs{display:flex;align-items:center;gap:25px;border-bottom:1px solid var(--color-border-strong);margin-bottom:29px;overflow:auto}.catalog-tabs button{font-size:12px;white-space:nowrap;padding:17px 0;position:relative;color:var(--color-muted);font-weight:600}.catalog-tabs button.selected{color:var(--color-text)}.catalog-tabs button.selected:after{content:'';position:absolute;bottom:0;height:2px;left:0;right:0;background:var(--color-accent-strong)}.catalog-tabs button>span{font-size:9px;padding:3px 6px;margin-left:5px;background:var(--color-surface-sunken)}.catalog-tabs button .icon{width:14px;height:14px;margin-right:5px}.catalog-layout{display:grid;grid-template-columns:196px minmax(0,1fr);gap:31px}.filter-heading{display:flex;align-items:center;justify-content:space-between}.filter-heading h3{font-size:12px;margin:0}.filter-heading button{font-size:10px;text-decoration:underline;color:var(--color-muted)}fieldset{border:0;padding:0;margin:29px 0}legend{font-size:11px;font-weight:700;margin-bottom:15px}fieldset label{font-size:11px;color:var(--color-muted);display:flex;align-items:center;gap:8px;margin:13px 0;cursor:pointer}input[type=checkbox]{accent-color:var(--color-accent-strong);width:14px;height:14px;margin:0}fieldset label span{margin-left:auto;font-size:9px;color:var(--color-subtle)}.filter-help{border:1px solid var(--color-border);padding:19px;margin-top:31px}.filter-help>.icon{color:var(--color-accent-strong)}.filter-help h4{font-size:12px;margin:10px 0 7px}.filter-help p{font-size:11px;line-height:1.6;color:var(--color-muted);margin:0 0 14px}.filter-help a{font-size:11px;font-weight:600;display:flex;align-items:center;gap:12px}.filter-help a .icon{width:14px}.results-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px;min-height:22px;color:var(--color-muted);font-size:11px}.sort-label{display:flex;align-items:center;gap:7px}.sort-label select{font-size:11px;border:0;background:transparent;color:var(--color-text);font-weight:600;max-width:135px}.product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:19px}.product-card{background:var(--color-surface);border:1px solid var(--color-border);position:relative;transition:border-color .25s,transform .25s;min-width:0}.product-card:hover{border-color:var(--color-border-strong);transform:translateY(-4px)}.product-picture{display:block;width:100%;background:var(--color-surface-sunken);position:relative;overflow:hidden;aspect-ratio: .84;padding:24px 23px 17px}.product-picture:after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 105%,rgb(var(--rgb-shadow) / .04),transparent 60%);pointer-events:none}.product-picture img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 8px 5px rgb(var(--rgb-shadow) / .13));transition:transform .35s;position:relative;z-index:1}.product-card:hover .product-picture img{transform:scale(1.045) rotate(1deg)}.product-badge{position:absolute;left:10px;top:10px;background:var(--color-surface);color:var(--color-text-soft);font-size:7px;letter-spacing:.8px;padding:5px 7px;z-index:2;font-weight:700}.product-badge.digital{background:var(--color-primary);color:var(--color-white)}.save-card{position:absolute;right:7px;top:7px;z-index:3;width:30px;height:30px;display:flex;align-items:center;justify-content:center;background:rgb(var(--rgb-white) / .85);border-radius:50%}.save-card .icon{width:15px;height:15px}.saved .icon{fill:var(--color-accent-strong);stroke:var(--color-accent-strong)}.product-info{padding:15px 13px 12px}.product-category{font-size:8px;text-transform:uppercase;letter-spacing:1px;color:var(--color-subtle);margin:0 0 7px}.product-title{font-size:13px;line-height:1.3;font-weight:600;display:block;min-height:34px;text-align:left;padding:0}.product-meta{font-size:9px;color:var(--color-subtle);margin:8px 0 17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.product-price{font-size:14px;font-weight:700;margin:0 0 5px}.product-availability{font-size:8px;color:var(--color-muted);display:flex;align-items:center;gap:5px}.product-availability:before{content:'';width:4px;height:4px;background:var(--color-border-strong);border-radius:50%}.product-actions{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--color-border);margin-top:14px;padding-top:10px;gap:5px}.product-actions a{font-size:9px;display:flex;justify-content:center;align-items:center;gap:4px;min-height:24px}.product-actions a:hover{color:var(--color-accent-strong)}.product-actions .icon{width:11px;height:11px}.product-actions a:last-child{border-left:1px solid var(--color-border)}.catalog-footnote{font-size:10px;color:var(--color-subtle);line-height:1.6;margin:25px 0 0}.empty-state{text-align:center;padding:65px 20px;border:1px dashed var(--color-border-strong)}.empty-state>span{font-size:45px}.empty-state h3{font-size:20px}.empty-state p{font-size:13px;color:var(--color-muted)}.collect-banner{background:var(--color-accent-strong);color:var(--color-white);overflow:hidden}.collect-inner{display:flex;align-items:center;gap:38px;min-height:250px;position:relative}.collect-inner h2{font-size:37px;letter-spacing:-.5px}.collect-inner h2 em{font-style:italic}.collect-inner .eyebrow{font-size:9px;opacity:.7;margin-bottom:13px}.collect-inner>.button{margin-left:auto;flex-shrink:0}.mini-monster{width:170px;height:180px;position:relative;flex-shrink:0;animation:monster-hop 3s ease-in-out infinite}.mini-monster svg{width:100%;height:100%;filter:drop-shadow(0 20px 13px rgb(var(--rgb-accent) / .33))}.monster-spark{position:absolute;font-size:45px;top:15px;right:-22px;color:var(--color-highlight);animation:twinkle 2s infinite}.steps{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line)}.steps article{padding:30px;position:relative}.steps article+article{border-left:1px solid var(--line)}.step-number{font-family:'Barlow Condensed',Impact,sans-serif;font-size:39px;line-height:1;color:var(--color-subtle)}.steps article>.icon{position:absolute;right:30px;top:33px;width:27px;height:27px}.steps h3{font-size:17px;font-weight:600;margin:24px 0 11px}.steps p{font-size:12px;color:var(--color-muted);line-height:1.7;margin:0}.muted{color:var(--color-muted);font-size:12px}.about-section{background:var(--color-background);border-top:1px solid var(--line);padding:66px 0}.about-layout{display:grid;grid-template-columns:1fr 1fr;gap:120px}.about-section .eyebrow{color:var(--color-muted);font-size:9px}.about-section h2{font-size:36px}.about-text{font-size:14px;color:var(--color-muted);line-height:1.7;max-width:430px;margin:23px 0}.about-info{display:flex;flex-direction:column;gap:13px;font-size:12px;margin:26px 0}.about-info>*{display:flex;align-items:center;gap:10px}.about-info .icon{width:16px;height:16px}.faq h3{font-size:17px;font-weight:600;margin:0 0 12px}.faq details{border-bottom:1px solid var(--color-border-strong)}.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:17px 0;font-size:12px;font-weight:500;gap:12px}.faq summary::-webkit-details-marker{display:none}.faq summary span{font-size:20px;font-weight:400}.faq details[open] summary span{transform:rotate(45deg)}.faq p{font-size:12px;color:var(--color-muted);line-height:1.75;margin:0 0 20px;padding-right:15px}footer{background:var(--color-primary);color:var(--color-white);padding:43px 0 0}.footer-top{display:flex;justify-content:space-between;align-items:center;gap:25px;padding-bottom:38px}.footer-top>p{font-family:'Barlow Condensed',Impact,sans-serif;font-size:28px;font-weight:700;line-height:1;margin:0}.footer-top>div{display:flex;flex-direction:column;gap:9px}.footer-top>div>span{font-size:8px;letter-spacing:2px;color:var(--color-on-dark-subtle)}.footer-top>div>a{font-size:19px;font-weight:600}.footer-top small{font-size:10px;color:var(--color-on-dark-subtle)}.footer-bottom{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--color-line-dark);padding:20px 0;color:var(--color-on-dark-subtle);font-size:9px}.back-top{color:var(--color-on-dark-muted)}.floating-wa{position:fixed;bottom:23px;right:24px;background:var(--color-primary);color:var(--color-white);border:1px solid var(--color-line-dark);padding:13px 17px;display:flex;align-items:center;gap:10px;z-index:25;box-shadow:0 5px 25px rgb(var(--rgb-shadow) / .2);font-size:11px;border-radius:3px}.floating-wa .icon{color:var(--color-highlight);width:19px;height:19px}.floating-wa:hover{background:var(--color-secondary)}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,30px);z-index:80;background:var(--color-primary);color:var(--color-white);padding:15px 22px;border:1px solid var(--color-line-dark);border-radius:3px;font-size:12px;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;max-width:90vw;text-align:center}.toast.visible{opacity:1;transform:translate(-50%,0)}dialog{padding:0;border:0;color:var(--color-text);width:min(990px,94vw);max-height:92dvh;overflow:auto;overscroll-behavior:contain}dialog::backdrop{background:rgb(var(--rgb-shadow) / .67);backdrop-filter:blur(5px)}.modal-close{position:absolute;right:12px;top:12px;font-size:29px;z-index:5;background:var(--color-surface);border:1px solid var(--color-border);width:35px;height:35px}.modal-layout{display:grid;grid-template-columns:1fr 1.05fr}.modal-gallery{background:var(--color-surface-sunken);display:flex;align-items:center;justify-content:center;flex-direction:column;min-width:0;padding:45px 28px}.modal-image-wrap{position:relative;width:100%;height:390px;display:flex;align-items:center;justify-content:center}.modal-image-wrap>img{max-height:100%;width:auto;max-width:100%;filter:drop-shadow(0 12px 10px rgb(var(--rgb-shadow) / .13));object-fit:contain}.zoom-button{position:absolute;right:0;bottom:0;background:var(--color-surface);border:1px solid var(--color-border)}.thumbnails{display:flex;gap:10px;justify-content:center;margin-top:25px}.thumbnails button{padding:5px;border:1px solid var(--color-border);background:var(--color-surface);width:50px;height:61px}.thumbnails button.active{border:2px solid var(--color-primary)}.thumbnails img{width:100%;height:100%;object-fit:contain}.gallery-caption{font-size:9px;color:var(--color-subtle);margin-top:18px;text-align:center}.modal-details{padding:43px 32px 25px}.modal-details>.eyebrow{font-size:9px;color:var(--color-subtle);padding-right:20px}.modal-details h2{font-size:28px;line-height:1.12;padding-right:5px}.modal-details>.muted{margin:12px 0 20px;font-size:11px}.detail-price{padding:19px 0;border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border)}.detail-price>span{display:block;font-size:10px;color:var(--color-muted)}.detail-price strong{font-size:24px;font-weight:600;display:flex;align-items:center;gap:15px;margin:6px 0}.detail-price small{font-size:10px;color:var(--color-muted)}dl{display:grid;grid-template-columns:1fr 1.2fr;gap:9px;font-size:11px;margin:20px 0}dt{color:var(--color-muted)}dd{margin:0;text-align:right;font-weight:500}.product-note{font-size:11px;line-height:1.6;background:var(--color-background);padding:12px;color:var(--color-muted)}.modal-ctas{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:18px 0}.modal-ctas>.button{font-size:11px;padding:12px;gap:9px}.modal-ctas .icon{width:15px;height:15px}.offer-form label{font-size:11px;font-weight:600;display:flex;justify-content:space-between;gap:7px}.offer-form label span{font-size:9px;color:var(--color-subtle);font-weight:400}.offer-form>div{display:flex;border:1px solid var(--color-border);height:42px;align-items:center;margin-top:9px}.currency{font-size:11px;color:var(--color-muted);padding:0 10px}.offer-form input{width:100%;min-width:0;border:0;outline:0;font-size:11px;background:none}.offer-form button{background:var(--color-accent-strong);height:100%;padding:0 12px;color:var(--color-white);font-size:10px;display:flex;gap:7px;align-items:center;white-space:nowrap}.offer-form .icon{width:13px;height:13px}.detail-photo-link{display:flex;align-items:center;gap:8px;font-size:10px;margin:19px 0}.detail-photo-link .icon{width:15px;height:15px}.detail-photo-link .icon:last-child{margin-left:auto;width:13px}.share-row{display:flex;gap:5px;border-top:1px solid var(--color-border);padding-top:14px}.share-row button{display:flex;align-items:center;gap:5px;font-size:9px;padding:7px;flex:1;justify-content:center;border:1px solid var(--color-border);white-space:nowrap}.share-row .icon{width:12px;height:12px}.wa-caption{font-size:9px;color:var(--color-subtle);line-height:1.5;margin:10px 0 15px}.modal-shipping{display:flex;align-items:center;gap:10px;font-size:10px;border-top:1px solid var(--color-border);padding-top:15px}.modal-shipping small{display:block;margin-top:4px;color:var(--color-subtle);font-size:9px}.modal-shipping>.icon{width:20px}.zoom-dialog{background:var(--color-primary);text-align:center;width:min(700px,96vw);padding:35px 20px 20px}.zoom-dialog>img{margin:0 auto 20px;max-height:73dvh;object-fit:contain}.filter-close,.mobile-filter{display:none}[hidden]{display:none!important} @keyframes float-front{0%,100%{transform:translateX(-50%) rotate(1deg) translateY(0)}50%{transform:translateX(-50%) rotate(-2deg) translateY(-14px)}}@keyframes float-left{0%,100%{transform:rotate(-20deg) translateY(0)}50%{transform:rotate(-17deg) translateY(10px)}}@keyframes float-right{0%,100%{transform:rotate(18deg) translateY(0)}50%{transform:rotate(21deg) translateY(-13px)}}@keyframes sheen{0%,50%{transform:translateX(-100%)}75%,100%{transform:translateX(100%)}}@keyframes twinkle{0%,100%{opacity:.3;transform:scale(.8) rotate(0)}50%{opacity:1;transform:scale(1.2) rotate(20deg)}}@keyframes bob{50%{transform:translateY(5px)}}@keyframes ticker{to{transform:translateX(-50%)}}@keyframes monster-hop{0%,65%,100%{transform:translateY(0) rotate(-4deg)}25%{transform:translateY(-14px) rotate(4deg)}40%{transform:translateY(0) rotate(0)}} @media(min-width:1500px){.hero-content{min-height:660px}.hero-copy{padding-top:65px}.hero-art{transform:scale(1.06)}} @media(max-width:1190px){.wrap{width:calc(100% - 64px)}.announcement{padding-left:32px;padding-right:32px}.search{margin-left:10px}.header-main{gap:18px}.header-nav{gap:23px}.contact-head{padding-left:14px;font-size:11px}.hero-content{min-height:590px}.hero h1{font-size:80px}.hero-card{width:190px;top:150px}.hero-front{width:239px;top:90px}.card-back-left{left:-8px}.card-back-right{right:-5px}.floating-tag{bottom:74px}.hero-seal{bottom:25px;right:-4px;width:85px;height:85px}.catalog-layout{grid-template-columns:170px 1fr;gap:22px}.product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.feature-image{right:15px;width:142px;top:35px}.feature-tile{padding:23px;min-height:255px}.feature-tile h3{font-size:28px}.feature-copy{width:62%}.about-layout{gap:65px}.collect-inner h2{font-size:33px}.collect-inner{gap:28px}.mini-monster{width:140px}.collect-inner>.button{font-size:11px;padding:15px}.section-head h2{font-size:31px}} @media(max-width:900px){.contact-head{font-size:0;gap:0;border:0;padding:0}.contact-head>.icon{width:21px;height:21px}.contact-head>.icon:last-child{display:none}.header-main{height:78px}.brand{font-size:19px}.brand small{font-size:18px}.header-nav{gap:24px;height:43px}.nav-location{display:none}.hero-content{min-height:540px}.hero h1{font-size:69px}.hero-copy{padding-top:45px}.hero-description{font-size:12px}.hero-front{width:201px;top:90px}.hero-card{width:164px;top:150px}.card-back-left{left:-8px}.card-back-right{right:-13px}.floating-tag{bottom:75px;font-size:8px;padding:12px}.hero-seal{display:none}.hero .eyebrow{font-size:8px}.art-label{font-size:7px;right:0}.hero-meta{font-size:9px;gap:17px}.feature-tile{min-height:224px;padding:21px}.feature-tile h3{font-size:24px}.feature-image{width:118px;right:14px;top:32px}.feature-link{font-size:9px;gap:8px}.feature-copy{width:64%}.catalog-layout{grid-template-columns:145px 1fr;gap:20px}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.catalog-tabs{gap:21px}.catalog-tabs button{font-size:11px}.catalog-note{font-size:9px}.section-head{align-items:start}.catalog .section-head{flex-direction:column;gap:15px}.mini-monster{width:110px}.collect-inner{gap:22px;min-height:220px}.collect-inner h2{font-size:28px}.collect-inner>.button{max-width:170px;gap:15px}.collect-inner .eyebrow{font-size:8px;letter-spacing:1px}.steps article{padding:22px}.steps h3{font-size:15px}.steps p{font-size:11px}.about-layout{gap:35px}.about-section h2{font-size:30px}.footer-top>p{font-size:24px}} @media(max-width:640px){html{scroll-padding-top:109px}.wrap{width:calc(100% - 36px)}.announcement{justify-content:center;padding:8px 12px;min-height:29px}.announcement>span:first-child{display:none}.announcement>span:last-child{font-size:9px}.header-main{height:65px;gap:12px}.brand{font-size:17px;gap:8px;letter-spacing:-.5px}.brand small{font-size:16px;letter-spacing:3px;margin-top:4px}.brand-mark{width:28px;height:35px}.brand-mark i{inset:4px 4px;border-width:2px}.brand-mark i:nth-child(3):after{font-size:13px;top:7px}.search{display:none;position:absolute;top:65px;left:18px;right:18px;max-width:none;margin:0;box-shadow:0 7px 15px rgb(var(--rgb-shadow) / .07);height:46px;z-index:6;background:var(--color-surface);border-color:var(--color-border-strong)}.search.visible{display:flex}.search input{font-size:12px}.mobile-search{display:flex;width:31px;height:36px}.favorite-nav{width:32px;height:36px}.favorite-nav span{font-size:8px;min-width:13px}.contact-head{order:4}.contact-head>.icon{width:20px}.header-nav{height:41px;gap:23px;overflow:auto;scrollbar-width:none;font-size:10px;width:100%;padding:0 18px}.header-nav::-webkit-scrollbar{display:none}.hero-content{display:flex;flex-direction:column;min-height:0}.hero-copy{padding:33px 0 0}.hero h1{font-size:64px;line-height:.9;letter-spacing:-.7px;margin-bottom:18px}.hero h1 br:nth-of-type(2){display:none}.hero h1 em{margin-right:9px}.hero h1{max-width:400px}.hero .eyebrow{font-size:8px;letter-spacing:1.5px;margin-bottom:17px}.hero-description{font-size:12px;margin-bottom:20px;line-height:1.6}.hero .button{padding:12px 18px;min-height:43px;font-size:11px;gap:25px}.hero-secondary{font-size:9px;margin-top:12px}.hero-meta{display:none}.hero-art{height:370px;margin:3px 0 0}.hero-front{width:187px;top:30px}.hero-card{width:151px;top:77px}.card-back-left{left:calc(50% - 155px)}.card-back-right{right:calc(50% - 155px)}.floating-tag{bottom:22px;font-size:8px;padding:11px 15px}.hero-art:before{width:430px;height:430px;top:-30px;left:calc(50% - 215px)}.orbit-one{width:290px;height:290px;top:48%}.orbit-two{width:365px;height:365px;top:48%}.art-label{top:45px;font-size:7px;right:5px}.spark-one{top:15px;left:16px;font-size:28px}.spark-two{right:15px;top:100px;font-size:32px}.spark-three{bottom:42px;left:17px;font-size:23px}.hero-bottom{height:42px;font-size:7px;letter-spacing:1px}.hero-bottom>span:nth-child(2){display:none}.ticker{height:31px}.ticker>div{font-size:13px;gap:25px}.ticker span{font-size:18px}.section-space{padding-top:39px;padding-bottom:39px}.section-head{margin-bottom:23px;gap:15px;align-items:end}.section-head h2{font-size:26px;letter-spacing:-.8px}.section-head .eyebrow{font-size:8px;letter-spacing:1.4px;margin-bottom:9px}.text-link{font-size:10px;gap:5px}.featured .section-head>.text-link{font-size:0;gap:0}.featured .section-head>.text-link .icon{width:25px;height:25px}.featured-grid{grid-template-columns:1fr;gap:14px}.feature-tile{min-height:213px;padding:24px}.feature-tile h3{font-size:31px;margin:14px 0 20px}.feature-copy{width:60%}.feature-image{width:134px;top:20px;right:28px}.legends .feature-image{right:30px}.feature-link{font-size:10px}.pill{font-size:7px}.catalog .section-head{gap:11px}.catalog-note{font-size:9px}.catalog-tabs{gap:24px;margin-bottom:18px}.catalog-tabs button{font-size:10px;padding:13px 0}.catalog-tabs button>span{font-size:8px}.catalog-layout{display:block}.filters{display:none}.filters.open{display:block;position:fixed;top:0;bottom:0;left:0;width:290px;z-index:61;background:var(--color-surface);padding:25px;overflow-y:auto}.filter-close{display:flex!important;font-size:24px!important;text-decoration:none!important}.filter-heading{gap:10px}.filter-heading .reset-filters{margin-left:auto}.filters fieldset label{font-size:13px;margin:17px 0}.filters legend{font-size:13px}.filter-overlay{position:fixed;inset:0;background:rgb(var(--rgb-shadow) / .53);z-index:60}.mobile-filter{display:inline-flex;align-items:center;gap:5px;font-size:10px;padding:6px 9px;border:1px solid var(--color-border);background:var(--color-surface);margin-left:auto}.mobile-filter .icon{width:12px;height:12px}.results-toolbar{font-size:9px;gap:8px;margin-bottom:14px;flex-wrap:wrap}.sort-label{font-size:0;gap:0}.sort-label select{font-size:10px;max-width:98px}.product-grid{gap:12px}.product-picture{padding:26px 19px 17px;aspect-ratio:.82}.product-info{padding:12px 11px 10px}.product-title{font-size:12px;min-height:32px}.product-category{font-size:7px;letter-spacing:.7px}.product-meta{font-size:8px;margin-bottom:13px}.product-price{font-size:13px}.product-availability{font-size:7px}.product-actions{gap:0;margin-top:12px}.product-actions a{font-size:8px;gap:3px;min-height:26px}.product-actions .icon{width:10px;height:10px}.product-badge{font-size:6px;padding:5px;left:7px;top:8px;max-width:110px}.save-card{width:26px;height:26px;right:5px;top:5px}.save-card .icon{width:13px;height:13px}.catalog-footnote{font-size:9px}.collect-inner{display:grid;grid-template-columns:1fr 90px;gap:17px 8px;padding:32px 0}.collect-inner>div:nth-child(2){grid-column:1;grid-row:1}.mini-monster{grid-column:2;grid-row:1 / span 2;width:95px;height:125px}.collect-inner h2{font-size:29px}.collect-inner .eyebrow{font-size:7px}.collect-inner>.button{grid-column:1;grid-row:2;margin:0;justify-self:start;max-width:none;font-size:10px;min-height:39px;padding:10px 15px}.monster-spark{font-size:27px;right:-7px;top:0}.steps{grid-template-columns:1fr}.steps article{padding:22px 23px 22px 73px;min-height:135px}.steps article+article{border-left:0;border-top:1px solid var(--line)}.step-number{position:absolute;left:21px;top:23px;font-size:32px}.steps article>.icon{right:23px;top:22px;width:20px;height:20px}.steps h3{font-size:15px;margin:1px 25px 9px 0}.steps p{font-size:11px}.order-section .section-head{display:block}.order-section .section-head>.muted{display:block;font-size:10px;margin-top:12px}.about-section{padding:37px 0}.about-layout{grid-template-columns:1fr;gap:35px}.about-section h2{font-size:31px}.about-text{font-size:12px;margin:19px 0}.about-info{font-size:11px}.faq h3{font-size:16px}.faq summary{font-size:11px;padding:16px 0}.faq p{font-size:11px}.footer-top{display:grid;grid-template-columns:1fr 1fr;align-items:start;gap:28px;padding-bottom:28px}.footer-top>p{font-size:23px;text-align:right}.footer-top>div{grid-column:1 / -1}.footer-top>div>a{font-size:19px}.footer-bottom{flex-wrap:wrap;gap:13px;font-size:8px;padding:17px 0 75px}.footer-bottom>span:nth-child(2){display:none}.floating-wa{bottom:15px;right:15px;padding:12px;font-size:10px;gap:8px}.floating-wa .icon{width:18px;height:18px}.toast{bottom:80px;font-size:11px;padding:12px 16px;width:max-content;max-width:90vw}.modal-layout{grid-template-columns:1fr}.modal-gallery{padding:25px 22px 18px}.modal-image-wrap{height:290px}.thumbnails{margin-top:18px;gap:8px}.thumbnails button{width:43px;height:51px}.gallery-caption{font-size:8px;margin-top:12px}.modal-details{padding:25px 23px}.modal-details h2{font-size:26px}.modal-details>.eyebrow{font-size:8px}.modal-close{position:sticky;float:right;margin:10px 10px -45px 0;top:10px;right:10px}.modal-details .modal-close{position:absolute}.modal-details>.muted{font-size:10px}.share-row button{font-size:9px}.modal-ctas>.button{font-size:11px}.zoom-dialog{padding:10px 16px 20px}.zoom-dialog>.modal-close{position:sticky}.zoom-dialog>img{margin-top:20px;max-height:72dvh}.zoom-dialog>.button{font-size:11px}.filter-help{margin-top:20px}} @media(max-width:370px){.hero h1{font-size:55px}.feature-tile h3{font-size:27px}.feature-image{width:119px;right:20px}.feature-tile{padding:20px;min-height:198px}.product-picture{padding:28px 12px 12px}.product-badge{font-size:5.5px}.product-actions a{font-size:7.5px}.product-actions .icon{display:none}.hero-secondary{font-size:8px}.collect-inner h2{font-size:26px}.sort-label select{max-width:90px}.section-head h2{font-size:24px}} @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}} .reference-badge{position:absolute;left:8px;bottom:8px;background:rgb(var(--rgb-white) / .87);font-size:7px;letter-spacing:.3px;padding:4px 6px;color:var(--color-muted);z-index:3}.availability-available{color:var(--color-success)}.availability-available:before{background:var(--color-success)}.availability-sold{color:var(--color-danger)}.availability-reference{color:var(--color-reference)}.stock-filter-label{margin-left:auto}.stock-filter-label select{border:1px solid var(--color-border);font-size:10px;background:var(--color-surface);padding:7px;max-width:130px}.breadcrumb{display:flex;align-items:center;gap:12px;padding:24px 0;color:var(--color-subtle);font-size:10px;flex-wrap:wrap}.breadcrumb b{color:var(--color-text-soft);font-weight:500}.breadcrumb a:hover{color:var(--color-accent-strong)}.standalone-product{border:1px solid var(--color-border);margin-top:12px;margin-bottom:35px}.product-page-panel{position:relative}.product-page-panel .modal-layout{grid-template-columns:1fr 1fr}.product-page-panel .modal-gallery{padding:50px;min-height:640px}.product-page-panel .modal-image-wrap{height:470px}.product-page-panel .modal-details{padding:45px}.product-page-panel .modal-details h2{font-size:37px}.product-page-panel .modal-close[hidden]{display:none}.product-page-panel .gallery-caption{font-size:10px}.source-credit{font-size:9px;color:var(--color-muted);display:block;margin:8px 0 16px;text-decoration:underline}.source-credit:empty{display:none}.related-cta{display:flex;justify-content:space-between;align-items:center;margin:45px auto 60px;gap:25px}.related-cta h2{font-size:28px}.related-cta .eyebrow{color:var(--color-subtle);font-size:9px}.page-intro{padding:40px 0 60px}.page-intro .eyebrow{color:var(--color-subtle)}.page-intro h1{font-family:'Barlow Condensed',Impact,sans-serif;font-size:72px;line-height:.98;letter-spacing:-1px;margin:0 0 23px;font-weight:700}.page-intro h1 em{font-style:italic;color:var(--color-accent-strong)}.page-intro>p:last-child{font-size:14px;color:var(--color-muted);line-height:1.7;max-width:600px}.collector-guide{padding-bottom:65px}.collector-guide h2{font-size:29px;margin-bottom:28px}.collector-guide>div{display:grid;grid-template-columns:repeat(3,1fr);gap:35px}.collector-guide article>span{font-size:9px;letter-spacing:1px;color:var(--color-accent-strong);font-weight:600}.collector-guide article h3{font-size:18px}.collector-guide article p{font-size:12px;color:var(--color-muted);line-height:1.8}.footer-admin:hover{color:var(--color-white)}.product-page-panel .modal-ctas>.button{font-size:12px}.product-page-panel .offer-form label{font-size:12px} @media(max-width:1000px){.product-page-panel .modal-gallery{padding:35px;min-height:0}.product-page-panel .modal-image-wrap{height:390px}.product-page-panel .modal-details{padding:35px 25px}.product-page-panel .modal-details h2{font-size:30px}.page-intro h1{font-size:60px}.stock-filter-label select{font-size:9px;max-width:110px}.product-page-panel .share-row{flex-wrap:wrap}.product-page-panel .share-row button{padding:9px 5px}} @media(max-width:640px){.product-page-panel .modal-layout{grid-template-columns:1fr}.product-page-panel .modal-gallery{padding:30px 23px 22px}.product-page-panel .modal-image-wrap{height:350px}.product-page-panel .modal-details{padding:28px 23px}.product-page-panel .modal-details h2{font-size:29px}.breadcrumb{padding:18px 0;font-size:9px;gap:8px}.standalone-product{margin-top:5px}.related-cta{flex-direction:column;align-items:start;margin:30px auto 40px}.related-cta h2{font-size:25px}.page-intro{padding:22px 0 38px}.page-intro h1{font-size:48px}.page-intro .eyebrow{font-size:8px}.page-intro>p:last-child{font-size:12px}.collector-guide{padding-bottom:37px}.collector-guide h2{font-size:25px}.collector-guide>div{grid-template-columns:1fr;gap:19px}.collector-guide article h3{font-size:17px;margin:13px 0}.collector-guide article p{font-size:11px;margin:0}.stock-filter-label{margin:0}.stock-filter-label select{font-size:9px;max-width:105px;padding:6px}.results-toolbar{row-gap:10px}.results-toolbar>span{flex-basis:100%}.mobile-filter{margin-left:0}.sort-label{margin-left:auto}.product-page-panel .modal-gallery .gallery-caption{font-size:8px}.catalog .section-head h2{max-width:95%}} /* MOVIRA COLLECT โ€” TAHAP 1 / 21 OCT 2026 Customer storefront only. Force LIGHT palette on every device/browser. Original rules, animations, catalogue behaviors and admin files preserved. */ :root{color-scheme:light} html,body{color-scheme:light} body{background:var(--color-surface);color:var(--ink)} input,select,textarea,button,dialog{color-scheme:light} button,a,summary{transition:color .18s ease,background-color .18s ease,border-color .18s ease,transform .2s ease} .button-red,.offer-form button{background:var(--color-accent-strong);color:var(--color-white)} .button-red:hover,.offer-form button:hover{background:var(--red-hover)} .red-dot,.product-page-panel .red-dot{background:var(--color-accent-strong)} .header-nav>a:hover,.text-link:hover,.product-actions a:hover,.breadcrumb a:hover{color:var(--color-accent-strong)} .header-nav>a:hover:after,.header-nav .active:after,.catalog-tabs button.selected:after{background:var(--color-accent-strong)} .site-header{background:var(--color-surface)} .hero{background:var(--color-primary);color:var(--color-white)} .ticker,.collect-banner{background:var(--color-accent-strong);color:var(--color-white)} .save-card.saved,.saved .icon{color:var(--color-accent-strong)} .catalog{background:var(--color-background)} .product-card:hover{border-color:var(--color-accent)} .product-actions a:focus-visible,.button:focus-visible,.header-nav a:focus-visible{outline:3px solid var(--color-accent-strong);outline-offset:3px} input,select,textarea{background-color:var(--color-surface);color:var(--color-text)} input::placeholder,textarea::placeholder{color:var(--color-muted)} /* Respect platform dark preferences without allowing dark form widgets. */ @media(prefers-color-scheme:dark){:root,html,body{color-scheme:light}input,select,textarea,button,dialog{color-scheme:light}} @media(max-width:640px){ .wrap{width:calc(100% - 36px)} .header-main{gap:10px} .header-nav{gap:20px;scrollbar-width:none;overscroll-behavior-x:contain} .header-nav>a{min-height:41px} .hero h1{font-size:clamp(49px,14.8vw,64px);overflow-wrap:normal} .hero .button-red{font-weight:700} .product-actions a{min-height:34px;font-size:10px} .product-card{min-width:0} .catalog-tabs button{min-height:44px} .offer-form button{font-size:10px} .floating-wa{min-height:46px} .modal-ctas>.button{min-height:44px} input,select,textarea{font-size:16px} .product-page-panel .modal-details{padding:26px 18px} .page-intro h1{overflow-wrap:break-word} } @media(max-width:370px){ .hero h1{font-size:clamp(43px,14vw,53px)} .feature-tile h3{font-size:25px} .product-actions a{font-size:9px} } /* TAHAP 1.1 โ€” Typography accessibility & mobile readability. Scoped to the public storefront; admin CSS and all JS remain unchanged. */ body{font-size:15px;line-height:1.55} .announcement,.announcement>span:last-child{font-size:11px;letter-spacing:.6px} .header-nav{font-size:13px} .nav-location,.header-main .contact-head{font-size:12px} .eyebrow,.section-head .eyebrow,.about-section .eyebrow,.hero .eyebrow{font-size:11px;letter-spacing:1.35px} .hero-description,.about-text{font-size:15px;line-height:1.7} .hero-secondary,.hero-meta,.hero-bottom{font-size:12px} .text-link,.feature-link{font-size:13px} .catalog-note,.catalog-footnote,.results-toolbar,.sort-label select{font-size:12px} .catalog-tabs button{font-size:13px} .catalog-tabs button>span{font-size:11px} .filter-heading h3,legend,.filters fieldset label,fieldset label,.filter-help p,.filter-help a{font-size:12px} .product-category,.product-badge,.product-availability{font-size:10px} .product-title{font-size:15px;line-height:1.38;min-height:40px} .product-meta{font-size:11px;white-space:normal;line-height:1.4} .product-price{font-size:17px} .product-actions a,.catalog-footnote,.feature-link{font-size:12px} .pill,.collect-inner .eyebrow{font-size:10px} .steps h3,.faq h3{font-size:18px} .steps p,.faq summary,.faq p,.collector-guide article p{font-size:13px;line-height:1.75} .footer-top small,.footer-bottom,.floating-wa,.footer-top>div>span{font-size:11px} .breadcrumb,.gallery-caption,.source-credit,.detail-photo-link,.wa-caption,.modal-shipping,.modal-shipping small{font-size:11px} .modal-details>.eyebrow,.modal-details>.muted,.modal-details .product-note,.modal-details dl,.detail-price>span,.detail-price small,.share-row button,.offer-form label,.offer-form input{font-size:12px} .modal-ctas>.button,.offer-form button{font-size:12px} @media(max-width:900px){ .header-nav{font-size:12px} .section-head .eyebrow{font-size:10px} .hero-description{font-size:14px} .steps p{font-size:12px} } @media(max-width:640px){ body{font-size:14px} .announcement>span:last-child{font-size:11px} .header-nav{font-size:12px;gap:19px} .header-nav>a{min-height:44px} .search input{font-size:16px} .hero .eyebrow,.section-head .eyebrow,.page-intro .eyebrow{font-size:10px;letter-spacing:1px} .hero-description{font-size:14px;line-height:1.65} .hero-secondary,.hero-bottom{font-size:11px} .hero .button,.text-link{font-size:12px} .catalog-note,.catalog-footnote,.results-toolbar{font-size:11px;line-height:1.5} .catalog-tabs button{font-size:12px;min-height:46px} .catalog-tabs button>span{font-size:10px} .product-picture{padding:16px 12px 12px} .product-info{padding:13px 12px 12px} .product-category,.product-badge,.product-availability{font-size:10px} .product-title{font-size:14px;min-height:39px} .product-meta{font-size:11px;line-height:1.45;min-height:0} .product-price{font-size:16px} .product-actions a{font-size:11px;line-height:1.25;padding:6px 2px;min-height:40px} .feature-link{font-size:12px} .pill{font-size:10px} .filter-help p,.filters fieldset label{font-size:13px} .steps h3{font-size:17px} .steps p,.faq summary,.faq p,.collector-guide article p{font-size:13px} .about-text,.page-intro>p:last-child{font-size:14px} .footer-top small,.footer-bottom,.floating-wa{font-size:11px} .breadcrumb,.source-credit,.gallery-caption,.product-page-panel .modal-gallery .gallery-caption{font-size:11px} .modal-details>.eyebrow,.modal-details>.muted,.modal-details .product-note,.modal-details dl,.detail-price>span,.detail-price small,.offer-form label,.offer-form input,.wa-caption,.modal-shipping{font-size:12px} .modal-ctas>.button,.offer-form button,.share-row button{font-size:12px} .stock-filter-label select{font-size:12px;max-width:130px} } @media(max-width:370px){ .product-title{font-size:13px} .product-actions a{font-size:10px} .hero h1{line-height:.94} } /* Movira Collect ยท Tahap 2: Sell Your Cards / Metode Pembayaran */ .sell-section{background:var(--color-background);border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border);scroll-margin-top:145px}.sell-layout{display:grid;grid-template-columns:1.05fr .95fr;gap:7%;align-items:center}.sell-intro h2{font-family:'Barlow Condensed',Impact,sans-serif;font-size:clamp(42px,5vw,72px);line-height:.99;letter-spacing:-.5px;margin:0 0 20px}.sell-intro h2 em{color:var(--color-accent-strong);font-style:normal}.sell-intro>p:not(.eyebrow):not(.sell-disclaimer){font-size:16px;line-height:1.75;color:var(--color-text-soft);max-width:600px;margin:0 0 23px}.sell-cta{border-radius:4px;text-align:center}.sell-disclaimer{font-size:12px;line-height:1.75;color:var(--color-muted);max-width:600px;margin:17px 0 0}.sell-process{background:var(--color-surface);border:1px solid var(--color-border);box-shadow:0 17px 46px rgb(var(--rgb-shadow) / .07);padding:30px}.sell-step{display:flex;gap:21px;align-items:flex-start;padding:21px 0}.sell-step+.sell-step{border-top:1px solid var(--color-border)}.sell-step>span{font-family:'Barlow Condensed',Impact,sans-serif;font-weight:800;color:var(--color-accent-strong);font-size:34px;line-height:1;min-width:43px}.sell-step h3{font-size:18px;line-height:1.3;margin:0 0 7px}.sell-step p{font-size:14px;line-height:1.65;color:var(--color-muted);margin:0}.payment-section{background:var(--color-surface);scroll-margin-top:145px}.payment-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.payment-options article{border:1px solid var(--color-border);background:var(--color-background);padding:27px;min-width:0;display:flex;flex-direction:column}.pay-symbol{font-size:12px;font-weight:800;color:var(--color-accent-strong);border-bottom:2px solid var(--color-accent);width:max-content;padding-bottom:9px}.payment-options h3{font-size:19px;line-height:1.3;margin:21px 0 10px}.payment-options p{font-size:14px;line-height:1.7;color:var(--color-text-soft);margin:0 0 22px}.payment-options article>span{font-size:12px;color:var(--color-accent-strong);font-weight:700;margin-top:auto}.payment-safety{font-size:13px;color:var(--color-text-soft);line-height:1.75;margin:21px 0 0;background:var(--color-background);border-left:3px solid var(--color-accent);padding:13px 16px}@media(max-width:820px){.sell-layout{grid-template-columns:1fr;gap:27px}.sell-process{padding:18px 24px}.payment-options{grid-template-columns:1fr}.payment-options article{padding:22px}.payment-options h3{margin:13px 0 7px}.payment-options p{margin-bottom:14px}}@media(max-width:640px){.sell-section,.payment-section{scroll-margin-top:115px}.sell-intro h2{font-size:clamp(42px,12vw,60px)}.sell-intro>p:not(.eyebrow):not(.sell-disclaimer){font-size:15px}.sell-disclaimer{font-size:12px}.sell-step h3{font-size:17px}.sell-step p,.payment-options p{font-size:14px}.sell-cta{width:100%;padding:14px 16px;font-size:13px;min-height:48px}.payment-section .section-head{display:block}.payment-section .section-head .muted{display:block;margin-top:12px}} /* Cart control visibility & readability */.product-actions{flex-wrap:wrap}.product-actions .ms-add-cart{flex:1 1 100%;min-height:39px;font-size:12px;font-weight:700;border:1px solid var(--color-accent);background:var(--color-primary);color:var(--color-white);cursor:pointer}.product-actions .ms-cart-unavailable{border-color:var(--color-border-strong);color:var(--color-muted);background:var(--color-background);cursor:help}.ms-detail-cart:not([hidden]){display:inline-flex!important;align-items:center;justify-content:center;min-height:44px;font-size:13px;font-weight:700;background:var(--color-primary);color:var(--color-white);padding:12px 22px} /* Checkout intentionally not published until stock and shipping are configured */ .ms-add-cart,.ms-detail-cart,#detailAddCart,#cartToggle,#cartNav,.ms-cart-toggle,[data-cart-open],[data-cart-add],[data-cart-unavailable],.cart-nav,.cart-header-button{display:none!important} .ms-cart-link{display:none!important} /* Movira Collect blue brand overrides */ :root{color-scheme:light} .brand{min-width:0}.brand .movira-logo{display:block;width:clamp(155px,13vw,205px);height:auto;max-height:64px;object-fit:contain}.brand-mark{display:none} .button-red:hover{background:var(--color-secondary)}.site-header{background:var(--color-surface)} .hero{background:var(--color-primary)}.hero-art:before{background:radial-gradient(circle,rgb(var(--rgb-highlight) / .31),transparent 65%)} .announcement{background:var(--color-primary)} .hero-grid{background-image:linear-gradient(90deg,transparent 99.7%,rgb(var(--rgb-highlight) / .07) 100%),linear-gradient(0deg,transparent 99.7%,rgb(var(--rgb-highlight) / .07) 100%)} .favorite-nav span{background:var(--color-primary)} .header-nav>a:hover:after,.header-nav .active:after{background:var(--color-highlight)} @media(max-width:600px){.brand .movira-logo{width:147px;max-height:48px}} /* Movira consistency patch */ .brand{min-width:0}.brand .movira-logo{display:block;width:clamp(155px,13vw,205px);height:auto;max-height:64px;object-fit:contain}.brand-mark{display:none!important}.button-red:hover,.offer-form button:hover{background:var(--color-secondary)}.sell-intro h2 em,.payment-options article>span,.red-text{color:var(--color-accent-strong)}.sell-section{background:var(--color-background);border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border)}.sell-process{border:1px solid var(--color-border);box-shadow:0 17px 46px rgb(var(--rgb-shadow) / .07)}.mcs-ro-option:hover,.mcs-ro-option:focus-visible,.mcs-ro-option[aria-selected="true"]{background:var(--color-highlight-soft);outline:none;color:var(--color-accent-strong)}.footer-top .brand .movira-logo{width:clamp(140px,11vw,190px)}@media(max-width:600px){.brand .movira-logo{width:147px;max-height:48px}} /* Restore unified Movira palette */ .sell-section{background:var(--color-background)!important}.sell-intro h2 em{color:var(--color-accent-strong)!important}.payment-options article>span{color:var(--color-accent-strong)!important}.brand .movira-logo{object-fit:contain;display:block}.mcs-track{scroll-margin-top:150px}.mcs-track .mcs-ro-intro h2 span{color:var(--color-accent-strong)} /* =========================================== MOVIRA COLLECT | Responsive UX 2026-10-22 CSS-only enhancement; backend and markup untouched =========================================== */ html{-webkit-text-size-adjust:100%;text-size-adjust:100%} body{overflow-x:clip} img,svg,video{max-width:100%} button,input,select,textarea{font:inherit} button,a,input,select,textarea{-webkit-tap-highlight-color:transparent} button,a{touch-action:manipulation} :where(button,a,input,select,textarea):focus-visible{outline:2px solid var(--color-focus);outline-offset:3px} :where(.button,.mcs-ro-button,.mcs-track button){min-height:44px} :where(.wrap,.header-main,.header-nav,.footer-top,.footer-bottom){min-width:0} .product-grid>*{min-width:0} /* Tracking and shipping card text should remain readable even on small screens */ .mcs-track{scroll-margin-top:120px} .mcs-track :is(input,select,button){min-height:46px} .mcs-track :is(input,select){font-size:16px} .mcs-track :is(h2,h3){line-height:1.16} .mcs-track :is(p,small){overflow-wrap:anywhere} .mcs-ro input,.mcs-ro select{font-size:16px} /* Responsive - tablet / narrow laptop */ @media (min-width:781px) and (max-width:1180px){ .header-main{gap:14px} .brand .movira-logo{width:160px} .header-nav{flex-wrap:wrap;gap:8px 17px;justify-content:flex-start;padding-bottom:12px} .header-nav>a{font-size:12px} .nav-location{margin-left:auto} .product-grid{grid-template-columns:repeat(3,minmax(0,1fr))} .featured-grid{gap:14px} .mcs-track{padding-inline:18px} } /* Mobile - 780px and smaller */ @media (max-width:780px){ :root{--mobile-gap:16px} html{scroll-padding-top:108px} .wrap{width:auto;max-width:none;margin-left:var(--mobile-gap);margin-right:var(--mobile-gap)} body{font-size:15px;line-height:1.55} .site-header{max-width:100vw} .header-main{min-height:74px;display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding-block:10px} .header-main .brand{flex:0 0 auto;max-width:165px} .brand .movira-logo{width:145px;max-height:49px;object-fit:contain} .header-main .search{order:5;flex:1 0 100%;max-width:none;min-width:0;width:100%;min-height:44px} .header-main .search input{font-size:16px;min-width:0} .header-main .contact-head{margin-left:auto} .header-nav{display:flex;flex-wrap:nowrap;gap:7px;max-width:calc(100vw - 2 * var(--mobile-gap));overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;white-space:nowrap;padding:11px 0 13px} .header-nav::-webkit-scrollbar{display:none} .header-nav>a{flex:0 0 auto;padding:9px 8px;font-size:12px;min-height:39px;line-height:1.4} .header-nav .nav-location{display:none} .announcement{font-size:10px;line-height:1.45} .hero-content{gap:24px} .hero h1{font-size:clamp(46px,10.5vw,76px);line-height:.96} .hero-description{font-size:15px;line-height:1.7} .hero .button{font-size:13px;padding:13px 15px} .section-head h2{line-height:1.1} .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px} .product-info{padding:13px 12px 12px} .product-title{font-size:14px;line-height:1.35;min-height:38px} .product-category,.product-meta,.product-availability{font-size:11px;line-height:1.4} .product-price{font-size:15px;line-height:1.35} .product-actions{flex-wrap:wrap;gap:5px} .product-actions a{font-size:11px;line-height:1.35;min-height:42px;justify-content:center} .product-badge{font-size:9px} .catalog-footnote{font-size:12px;line-height:1.55} .about-text,.steps p,.faq p,.order-section p{font-size:14px;line-height:1.7} .faq summary{font-size:14px;min-height:48px} .mcs-ro{padding-block:44px} .mcs-ro-intro{display:block} .mcs-ro-layout{display:grid;grid-template-columns:minmax(0,1fr)} .mcs-ro-results{border-left:0;border-top:1px solid var(--color-border)} .mcs-ro-form,.mcs-ro-results{padding:20px 16px} .mcs-ro-intro h2{font-size:clamp(34px,8vw,49px)} .mcs-ro label,.mcs-ro-info strong{font-size:14px} .mcs-ro-message,.mcs-ro-info small{font-size:12px} .mcs-track{padding:42px 0} .mcs-track :is(input,select,button){width:100%;min-width:0} .footer-top>p{font-size:21px} .footer-bottom{font-size:11px;line-height:1.6;gap:14px} .floating-wa{font-size:12px;min-height:44px} } @media (max-width:420px){ :root{--mobile-gap:14px} .header-main .brand{max-width:144px} .brand .movira-logo{width:132px} .header-main .contact-head{font-size:11px} .hero h1{font-size:clamp(43px,11.1vw,56px)} .product-grid{gap:10px} .product-title{font-size:13px} .product-price{font-size:14px} .product-info{padding:11px 10px} .product-actions a{font-size:10px} .mcs-ro-info{grid-template-columns:1fr} .mcs-ro-form,.mcs-ro-results{padding:16px 13px} .footer-top{gap:18px} } @media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}} /* Mivora Collect revision 2026-10-23 */ .hero h1 em{color:var(--color-white)!important;text-shadow:0 0 22px rgb(var(--rgb-highlight) / .25)} .footer-story{color:var(--color-white)!important} .announcement b .icon,.hero-secondary .icon,.footer-top a .icon,.footer-bottom a .icon,.mcs-ro-button .icon,.floating-tag .icon{width:16px;height:16px;vertical-align:middle;flex-shrink:0} .hero-secondary span,.footer-top a,.footer-bottom a,.mcs-ro-button{display:inline-flex;align-items:center;gap:8px} .hero-card,.hero-front,.feature-image img{transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden} .hero-card img,.hero-front img,.feature-image img{image-rendering:auto;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:translateZ(0);will-change:transform} .hero-card,.hero-front{filter:none} /* improve logo rendering */ .brand .movira-logo,.admin-sidebar .movira-logo-light,.lock-brand-panel .movira-logo-light{display:block;height:auto;object-fit:contain} .brand .movira-logo{max-width:100%} /* iOS arrow glyph fallback removed via svg, keep links aligned */ .footer-bottom .back-top,.footer-admin,.contact-head,.hero-secondary span{gap:8px} /* tracking label alignment */ #mcsTrackForm .mcs-track-field{min-width:0} @media(max-width:900px){.footer-bottom{gap:12px;flex-wrap:wrap}.footer-bottom .footer-story{order:3;width:100%;font-size:11px}} /* 2026-10-23 follow-up patch: improve readability & remove soft header card rendering */ .hero h1 em{color:var(--color-white)!important;text-shadow:none!important} .announcement{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap} .announcement span:last-child{display:inline-flex;align-items:center;gap:8px} .hero-art img,.hero-card img,.hero-front img{filter:none!important;backdrop-filter:none!important;image-rendering:auto!important;opacity:1!important} .hero-card,.hero-front,.hero-art .card-shot{filter:none!important;backdrop-filter:none!important} .catalog-tabs button{white-space:nowrap} /* ===================================================== MOVIRA COLLECT | UI refinement 2026-10-27 Root-cause fixes verified in a 320โ€“1440px viewport audit. Base fix lives in the reset above: img{height:auto}. Hero tags carry width/height attributes; without height:auto the cards were stretched to the attribute height and the front card was cropped by object-fit:cover, i.e. upscaled ~3x on iPhone (blurry). ===================================================== */ /* Large rotated card images: the animated parent already gets its own layer, extra hints only add GPU memory on iOS. */ .hero-front img,.feature-image img{will-change:auto;transform:none} /* Condensed fallbacks while Barlow Condensed is still loading (first visit / private browsing); iOS has no Arial Narrow or Impact. */ .hero h1,.page-intro h1,.sell-intro h2,.feature-tile h3,.ticker>div,.footer-top>p{font-family:'Barlow Condensed','Avenir Next Condensed','HelveticaNeue-CondensedBold','Arial Narrow','Roboto Condensed',Impact,sans-serif} .floating-wa{bottom:calc(23px + env(safe-area-inset-bottom));right:calc(24px + env(safe-area-inset-right))} @media(max-width:900px){ /* .catalog .section-head is a column here; the later mobile rule align-items:end pushed the heading to the right edge. */ .catalog .section-head{align-items:flex-start} } @media(max-width:780px){ /* The 900px rule fixed the header at 78px, but here the search bar wraps to its own row and overlapped the nav. */ .header-main{height:auto} .header-nav>a{min-height:44px} } @media(min-width:641px) and (max-width:780px){html{scroll-padding-top:190px}} @media(max-width:640px){ .favorite-nav,.mobile-search{width:44px;height:44px} .favorite-nav span{font-size:10px;min-width:17px;line-height:13px} .save-card{width:36px;height:36px} .floating-tag,.product-badge,.reference-badge{font-size:10px} .mobile-filter{font-size:12px;min-height:40px;padding:8px 12px} .sort-label select,.stock-filter-label select{min-height:40px} /* Chat button: compact round control so it no longer covers hero links and product cards; label stays as aria-label. */ .floating-wa{font-size:0;gap:0;padding:0;width:52px;height:52px;min-height:52px;justify-content:center;border-radius:50%;bottom:calc(16px + env(safe-area-inset-bottom));right:calc(16px + env(safe-area-inset-right))} .floating-wa .icon{width:24px;height:24px} .hero .hero-secondary{display:flex;align-items:center;flex-wrap:wrap;min-height:40px;margin-top:2px} .breadcrumb a{padding:10px 0} .catalog-tabs button{padding-inline:4px} } @media(max-width:480px){ /* Typography patches re-enabled the "Hubungi kami" label, which wrapped onto its own header row at 320-430px. */ .header-main .contact-head{font-size:0;gap:0;border:0;padding:0;margin-left:0;width:44px;height:44px;justify-content:center} .header-main .contact-head>.icon:first-child{width:22px;height:22px} .header-main .contact-head>.icon:last-child{display:none} } @media(max-width:420px){ .hero-bottom>span:nth-child(3){display:none} .hero-bottom>span:first-child{white-space:nowrap} } @media(max-width:374px){ .header-main{gap:6px} .brand .movira-logo{width:118px} /* Keep the three-card cluster inside a 320px screen instead of cropping the back cards at the edges. */ .hero-art{height:330px} .hero-front{width:164px;top:26px} .hero-card{width:128px;top:70px} .card-back-left{left:calc(50% - 138px)} .card-back-right{right:calc(50% - 138px)} } /* ===================================================================== MIVORA COLLECT | DESIGN SYSTEM LAYER 2026-10-29 Midnight Navy / Deep Slate / Ice Cyan / Electric Teal. Visual only: markup hooks, JS behaviour, routes and data untouched. Decorative layers use pseudo-elements with pointer-events:none and sit behind content inside an isolated stacking context. ===================================================================== */ html{color-scheme:light} body{background:var(--color-background);color:var(--color-text)} ::selection{background:var(--color-highlight);color:var(--color-primary)} h2{letter-spacing:-.9px} :where(button,a,input,select,textarea,summary):focus-visible{outline:2px solid var(--color-focus);outline-offset:3px} :where(.announcement,.site-header,.hero,.ticker,.collect-banner,footer,.zoom-dialog,.floating-wa,.legends) :focus-visible{outline-color:var(--color-highlight)} input::placeholder,textarea::placeholder{color:var(--color-subtle);opacity:1} input,select,textarea{color:var(--color-text);background-color:var(--color-surface)} .button:disabled,.button:disabled:hover,.button[aria-disabled="true"]{cursor:not-allowed;background:var(--color-disabled-bg);color:var(--color-disabled-text);border-color:var(--color-disabled-bg);box-shadow:none;transform:none;opacity:1} /* ---------- Announcement ---------- */ .announcement{background:var(--color-primary-deep);color:var(--color-on-dark-muted);border-bottom:1px solid var(--color-line-dark)} .announcement b,.announcement .icon{color:var(--color-highlight)} /* ---------- Header & navbar: premium navy with geometric layer ---------- */ .site-header{background:linear-gradient(112deg,var(--color-primary-deep) 0%,var(--color-primary) 46%,var(--color-secondary) 100%);color:var(--color-white);border-bottom:1px solid var(--color-line-dark);isolation:isolate;box-shadow:0 10px 30px rgb(var(--rgb-shadow) / .18)} .site-header::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none; background: linear-gradient(115deg,transparent 0 58%,rgb(var(--rgb-highlight) / .07) 58% 66%,transparent 66% 100%), linear-gradient(115deg,transparent 0 70%,rgb(var(--rgb-highlight) / .05) 70% 71%,transparent 71% 79%,rgb(var(--rgb-highlight) / .05) 79% 80%,transparent 80%), radial-gradient(420px 140px at 88% 0%,rgb(var(--rgb-highlight) / .16),transparent 70%), radial-gradient(360px 120px at 8% 100%,rgb(var(--rgb-accent) / .14),transparent 70%)} .site-header::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:1px;z-index:-1;pointer-events:none;background:linear-gradient(90deg,transparent,rgb(var(--rgb-highlight) / .55) 30%,rgb(var(--rgb-accent) / .7) 60%,transparent)} .site-header .brand,.site-header a,.site-header button{color:var(--color-white)} .search{background:rgb(var(--rgb-white) / .07);border:1px solid rgb(var(--rgb-highlight) / .18);border-radius:var(--radius-pill);color:var(--color-on-dark-muted);transition:border-color var(--speed) ease,background-color var(--speed) ease,box-shadow var(--speed) ease} .search:focus-within{border-color:var(--color-highlight);background:rgb(var(--rgb-white) / .11);box-shadow:0 0 0 3px rgb(var(--rgb-highlight) / .16)} .search input{color:var(--color-white);background:transparent} .search input::placeholder{color:var(--color-on-dark-subtle)} .search input:focus-visible{outline:0} .search kbd{color:var(--color-on-dark-subtle)} .search .icon{color:var(--color-highlight)} .icon-button:hover{background:rgb(var(--rgb-highlight) / .12)} .site-header .icon-button:hover{color:var(--color-highlight)} .favorite-nav span{background:var(--color-highlight);color:var(--color-primary);font-weight:700;box-shadow:0 0 0 2px var(--color-primary)} .contact-head{border-left-color:var(--color-line-dark);color:var(--color-white)} .site-header .contact-head:hover{color:var(--color-highlight)} .header-nav{border-top:1px solid var(--color-line-dark)} .site-header .header-nav>a{color:var(--color-on-dark-muted)} .site-header .header-nav>a:hover,.site-header .header-nav>a.active{color:var(--color-white)} .header-nav>a:hover:after,.header-nav .active:after{background:var(--color-highlight);border-radius:3px 3px 0 0;box-shadow:0 0 12px rgb(var(--rgb-highlight) / .55)} .nav-location{color:var(--color-on-dark-subtle)} .nav-location .icon{color:var(--color-accent)} @media(max-width:640px){ .search,.search.visible{background:var(--color-primary-deep);border-color:rgb(var(--rgb-highlight) / .3);box-shadow:var(--shadow-lg)} } /* ---------- Hero: navy base, diagonal planes, fine lines, soft cyan glow ---------- */ .hero{background: radial-gradient(900px 520px at 78% 30%,rgb(var(--rgb-accent) / .30),transparent 62%), radial-gradient(600px 420px at 6% 96%,rgb(var(--rgb-highlight) / .10),transparent 70%), linear-gradient(135deg,var(--color-primary-deep) 0%,var(--color-primary) 48%,var(--color-secondary) 100%);color:var(--color-white);isolation:isolate} .hero::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none; background: linear-gradient(118deg,transparent 0 52%,rgb(var(--rgb-highlight) / .06) 52% 63%,transparent 63% 100%), linear-gradient(118deg,transparent 0 63%,rgb(var(--rgb-white) / .035) 63% 74%,transparent 74% 100%), linear-gradient(62deg,transparent 0 82%,rgb(var(--rgb-accent) / .10) 82% 90%,transparent 90% 100%)} .hero::after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.9; background: linear-gradient(118deg,transparent calc(50% - 1px),rgb(var(--rgb-highlight) / .28) 50%,transparent calc(50% + 1px)) 0 0/100% 100% no-repeat, linear-gradient(118deg,transparent calc(76% - 1px),rgb(var(--rgb-highlight) / .14) 76%,transparent calc(76% + 1px)) 0 0/100% 100% no-repeat, linear-gradient(90deg,var(--color-highlight),transparent) 4% 14%/120px 2px no-repeat, linear-gradient(90deg,var(--color-accent),transparent) 92% 86%/90px 2px no-repeat, linear-gradient(180deg,rgb(var(--rgb-highlight) / .5),transparent) 96% 10%/2px 80px no-repeat} .hero-grid{z-index:0;pointer-events:none;background-image:linear-gradient(90deg,transparent 99.7%,rgb(var(--rgb-highlight) / .06) 100%),linear-gradient(0deg,transparent 99.7%,rgb(var(--rgb-highlight) / .06) 100%)} .hero-content,.hero-bottom{z-index:1} .hero .eyebrow{color:var(--color-highlight)} .hero h1{color:var(--color-white);text-shadow:0 2px 30px rgb(var(--rgb-shadow) / .35)} .hero h1 em{color:var(--color-highlight)!important;text-shadow:0 0 28px rgb(var(--rgb-highlight) / .28)!important} .hero-description{color:var(--color-on-dark-muted)} .hero-secondary{color:var(--color-on-dark-subtle)} .hero-secondary span{color:var(--color-white)} .hero-secondary:hover span{color:var(--color-highlight)} .hero-meta{color:var(--color-on-dark-subtle)}.hero-meta .icon{color:var(--color-highlight)} .hero-art:before{background:radial-gradient(circle,rgb(var(--rgb-highlight) / .22),rgb(var(--rgb-accent) / .08) 40%,transparent 66%)} .hero-card{border-color:var(--color-secondary);box-shadow:0 30px 60px rgb(var(--rgb-shadow) / .55),0 0 0 1px rgb(var(--rgb-highlight) / .12)} .hero-front{background:linear-gradient(145deg,var(--color-highlight-hover),var(--color-accent) 30%,var(--color-white) 62%,var(--color-secondary));box-shadow:0 28px 60px rgb(var(--rgb-shadow) / .6),0 0 40px rgb(var(--rgb-highlight) / .18)} .floating-tag{background:var(--color-white);color:var(--color-primary);border-radius:var(--radius-sm);box-shadow:0 10px 30px rgb(var(--rgb-shadow) / .4)} .red-dot{background:var(--color-accent);box-shadow:0 0 0 3px rgb(var(--rgb-accent) / .18)} .hero .red-dot{background:var(--color-highlight);box-shadow:0 0 10px rgb(var(--rgb-highlight) / .7)} .floating-tag .red-dot{background:var(--color-accent);box-shadow:none} .green-dot{background:var(--color-success)} .art-label{color:var(--color-on-dark-subtle)} .hero-seal{border-color:rgb(var(--rgb-highlight) / .35);color:var(--color-on-dark-muted);background:rgb(var(--rgb-primary) / .35)} .orbit{border-color:rgb(var(--rgb-highlight) / .10)} .orbit-two{border-style:dashed;border-color:rgb(var(--rgb-highlight) / .08)} .spark{color:var(--color-highlight)} .hero-bottom{border-top-color:var(--color-line-dark);color:var(--color-on-dark-subtle)} .hero-bottom b{color:var(--color-accent)} /* ---------- Ticker ---------- */ .ticker{background:var(--color-secondary);color:var(--color-highlight);border-top:1px solid var(--color-line-dark);border-bottom:1px solid var(--color-line-dark)} .ticker span{color:var(--color-accent)} /* ---------- Buttons ---------- */ .button{border-radius:var(--radius-sm);transition:background-color var(--speed) ease,color var(--speed) ease,border-color var(--speed) ease,box-shadow var(--speed) ease,transform .2s var(--ease)} .button:active{transform:translateY(0)} .button-red,.sell-cta{background:var(--color-highlight);color:var(--color-primary);border-color:rgb(var(--rgb-accent) / .45);font-weight:700;box-shadow:0 8px 22px rgb(var(--rgb-highlight) / .22)} .button-red:hover,.sell-cta:hover{background:var(--color-highlight-hover);color:var(--color-primary);box-shadow:0 10px 28px rgb(var(--rgb-highlight) / .32)} .button-black{background:var(--color-primary);color:var(--color-white)} .button-black:hover{background:var(--color-secondary)} .button-white{background:var(--color-white);color:var(--color-primary)} .button-white:hover{background:var(--color-highlight)} .button-outline{background:var(--color-surface);border-color:var(--color-border-strong);color:var(--color-primary)} .button-outline:hover{border-color:var(--color-accent);color:var(--color-accent-strong);background:var(--color-highlight-soft)} .text-link{color:var(--color-primary)} .text-link:hover{color:var(--color-accent-strong)} .red-text{color:var(--color-accent)!important} .text-link .icon{color:var(--color-accent)} /* ---------- Section heads ---------- */ .section-head .eyebrow,.about-section .eyebrow,.page-intro .eyebrow,.related-cta .eyebrow,.sell-intro .eyebrow,.ms-check-heading .eyebrow{color:var(--color-accent-strong)} .muted{color:var(--color-muted)} /* ---------- Featured tiles ---------- */ .feature-tile{border-radius:var(--radius-lg);border:1px solid var(--color-border);transition:box-shadow var(--speed) ease,border-color var(--speed) ease} .feature-tile:hover{box-shadow:var(--shadow-md);border-color:rgb(var(--rgb-accent) / .45)} .electric{background:linear-gradient(135deg,var(--color-highlight-soft),var(--color-white) 70%)} .electric-bolt{color:rgb(var(--rgb-accent) / .14)} .legends{background:linear-gradient(135deg,var(--color-secondary),var(--color-primary));color:var(--color-white);border-color:var(--color-line-dark);isolation:isolate} .legends::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(118deg,transparent 0 55%,rgb(var(--rgb-highlight) / .08) 55% 68%,transparent 68%),radial-gradient(260px 200px at 85% 20%,rgb(var(--rgb-accent) / .25),transparent 70%)} .legends .feature-link{color:var(--color-highlight)} .pill{border-radius:var(--radius-pill);padding:6px 10px} .dark-pill{background:var(--color-primary);color:var(--color-highlight)} .light-pill{border-color:rgb(var(--rgb-highlight) / .5);color:var(--color-highlight)} .feature-image{filter:drop-shadow(5px 12px 10px rgb(var(--rgb-shadow) / .28))} /* ---------- Catalogue ---------- */ .catalog{background:var(--color-background);border-top-color:var(--color-border)} .catalog-note{color:var(--color-muted)} .catalog-tabs{border-bottom-color:var(--color-border)} .catalog-tabs button{color:var(--color-muted)} .catalog-tabs button:hover,.catalog-tabs button.selected{color:var(--color-primary)} .catalog-tabs button.selected:after{background:var(--color-accent);height:3px;border-radius:3px 3px 0 0} .catalog-tabs button>span{background:var(--color-surface-sunken);color:var(--color-text-soft);border-radius:var(--radius-pill)} .catalog-tabs button.selected>span{background:var(--color-highlight);color:var(--color-primary)} .filter-heading button{color:var(--color-muted)} .filter-heading button:hover{color:var(--color-accent-strong)} fieldset label{color:var(--color-text-soft)} fieldset label span{color:var(--color-subtle)} input[type=checkbox],input[type=radio]{accent-color:var(--color-accent)} .filter-help{background:var(--color-surface);border-color:var(--color-border);border-radius:var(--radius-md)} .filter-help>.icon{color:var(--color-accent)} .filter-help p{color:var(--color-muted)} .filter-help a:hover{color:var(--color-accent-strong)} .filters.open{background:var(--color-surface);box-shadow:var(--shadow-lg)} .filter-overlay{background:var(--color-overlay)} .mobile-filter{background:var(--color-surface);border-color:var(--color-border-strong);border-radius:var(--radius-sm);color:var(--color-primary)} .results-toolbar{color:var(--color-muted)} .sort-label select{color:var(--color-primary)} .stock-filter-label select{border-color:var(--color-border-strong);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-primary)} .product-card{background:var(--color-surface);border-color:var(--color-border);border-radius:var(--radius-md);overflow:hidden;transition:border-color var(--speed) ease,box-shadow var(--speed) ease,transform .25s var(--ease)} .product-card:hover{border-color:rgb(var(--rgb-accent) / .55);box-shadow:var(--shadow-md)} .product-picture{background:linear-gradient(180deg,var(--color-surface-sunken),var(--color-background))} .product-picture:focus-visible{outline-offset:-3px} .product-badge{background:var(--color-surface);color:var(--color-primary);border:1px solid var(--color-border);border-radius:var(--radius-pill);padding:5px 8px} .product-badge.digital{background:var(--color-primary);color:var(--color-highlight);border-color:var(--color-primary)} .reference-badge{background:rgb(var(--rgb-white) / .9);color:var(--color-muted);border-radius:var(--radius-pill)} .save-card{background:rgb(var(--rgb-white) / .88);color:var(--color-primary);box-shadow:var(--shadow-sm)} .save-card:hover{color:var(--color-accent-strong)} .save-card.saved,.saved .icon{color:var(--color-accent)} .saved .icon{fill:var(--color-accent);stroke:var(--color-accent)} .product-category{color:var(--color-accent-strong)} .product-title,.product-price{color:var(--color-primary)} .product-meta,.product-availability,.catalog-footnote{color:var(--color-muted)} .product-availability:before{background:var(--color-subtle)} .availability-available{color:var(--color-success)}.availability-available:before{background:var(--color-success)} .availability-sold{color:var(--color-danger)}.availability-sold:before{background:var(--color-danger)} .availability-reference{color:var(--color-reference)}.availability-reference:before{background:var(--color-reference)} .availability-reserved{color:var(--color-warning)}.availability-reserved:before{background:var(--color-warning)} .product-actions{border-top-color:var(--color-border)} .product-actions a{color:var(--color-text-soft)} .product-actions a:hover{color:var(--color-accent-strong)} .product-actions a:last-child{border-left-color:var(--color-border)} .empty-state{border-color:var(--color-border-strong);border-radius:var(--radius-md);background:var(--color-surface)} .empty-state p{color:var(--color-muted)} /* ---------- Collect banner ---------- */ .collect-banner{background:linear-gradient(120deg,var(--color-primary) 0%,var(--color-secondary) 100%);color:var(--color-white);position:relative;isolation:isolate} .collect-banner::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(118deg,transparent 0 60%,rgb(var(--rgb-highlight) / .07) 60% 72%,transparent 72%),linear-gradient(118deg,transparent calc(80% - 1px),rgb(var(--rgb-highlight) / .25) 80%,transparent calc(80% + 1px)),radial-gradient(420px 220px at 12% 50%,rgb(var(--rgb-accent) / .28),transparent 70%)} .collect-inner .eyebrow{color:var(--color-highlight);opacity:1} .collect-inner h2 em{color:var(--color-highlight)} .mini-monster svg{filter:drop-shadow(0 20px 13px rgb(var(--rgb-shadow) / .45))} /* ---------- Steps, sell, payment, about ---------- */ .steps{border-color:var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);overflow:hidden} .steps article+article{border-color:var(--color-border)} .step-number{color:rgb(var(--rgb-accent) / .45)} .steps article>.icon{color:var(--color-accent)} .steps p{color:var(--color-muted)} .sell-section{background:var(--color-background)!important;border-color:var(--color-border)!important} .sell-intro h2 em{color:var(--color-accent-strong)!important} .sell-intro>p:not(.eyebrow):not(.sell-disclaimer){color:var(--color-text-soft)} .sell-disclaimer{color:var(--color-muted)} .sell-process{background:var(--color-surface);border-color:var(--color-border)!important;border-radius:var(--radius-lg);box-shadow:var(--shadow-md)!important} .sell-step+.sell-step{border-top-color:var(--color-border)} .sell-step>span{color:var(--color-accent)} .sell-step p{color:var(--color-muted)} .payment-section{background:var(--color-surface)} .payment-options article{background:var(--color-background);border-color:var(--color-border);border-radius:var(--radius-md);transition:border-color var(--speed) ease,box-shadow var(--speed) ease} .payment-options article:hover{border-color:rgb(var(--rgb-accent) / .5);box-shadow:var(--shadow-sm)} .pay-symbol{color:var(--color-accent-strong);border-bottom-color:var(--color-accent)} .payment-options p{color:var(--color-muted)} .payment-options article>span{color:var(--color-accent-strong)!important} .payment-safety{background:var(--color-highlight-soft);border-left-color:var(--color-accent);color:var(--color-text-soft);border-radius:0 var(--radius-sm) var(--radius-sm) 0} .about-section{background:var(--color-background);border-top-color:var(--color-border)} .about-text{color:var(--color-muted)} .about-info .icon{color:var(--color-accent)} .about-info a:hover{color:var(--color-accent-strong)} .faq details{border-bottom-color:var(--color-border)} .faq summary:hover{color:var(--color-accent-strong)} .faq summary span{color:var(--color-accent);transition:transform var(--speed) ease} .faq p{color:var(--color-muted)} /* ---------- Footer: navy with the header's geometric motif ---------- */ footer{background:linear-gradient(160deg,var(--color-primary) 0%,var(--color-primary-deep) 100%);color:var(--color-white);position:relative;isolation:isolate} footer::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,transparent,rgb(var(--rgb-highlight) / .45) 35%,rgb(var(--rgb-accent) / .55) 65%,transparent) 0 0/100% 1px no-repeat,linear-gradient(118deg,transparent 0 64%,rgb(var(--rgb-highlight) / .05) 64% 76%,transparent 76%)} .footer-top>div>span{color:var(--color-highlight)} .footer-top>div>a:hover,.footer-bottom a:hover,.footer-admin:hover{color:var(--color-highlight)} .footer-top small{color:var(--color-on-dark-subtle)} .footer-bottom{border-top-color:var(--color-line-dark);color:var(--color-on-dark-subtle)} .back-top{color:var(--color-on-dark-muted)} .footer-story{color:var(--color-on-dark-muted)!important} /* ---------- Floating WhatsApp, toast ---------- */ .floating-wa{background:var(--color-primary);color:var(--color-white);border:1px solid rgb(var(--rgb-highlight) / .35);border-radius:var(--radius-pill);box-shadow:0 10px 28px rgb(var(--rgb-shadow) / .35)} .floating-wa:hover{background:var(--color-secondary);border-color:var(--color-highlight)} .floating-wa .icon{color:var(--color-highlight)} .toast{background:var(--color-primary);color:var(--color-white);border:1px solid rgb(var(--rgb-highlight) / .25);border-radius:var(--radius-md);box-shadow:var(--shadow-lg)} /* ---------- Product dialog & product page ---------- */ dialog{color:var(--color-text);background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg)} dialog::backdrop{background:var(--color-overlay)} .modal-close{background:var(--color-surface);border-color:var(--color-border);border-radius:var(--radius-pill);color:var(--color-primary)} .modal-close:hover{border-color:var(--color-accent);color:var(--color-accent-strong);background:var(--color-highlight-soft)} .modal-gallery{background:linear-gradient(180deg,var(--color-surface-sunken),var(--color-background))} .zoom-button{background:var(--color-surface);border-color:var(--color-border);color:var(--color-primary)} .thumbnails button{border-color:var(--color-border);background:var(--color-surface);border-radius:var(--radius-sm)} .thumbnails button:hover{border-color:var(--color-border-strong)} .thumbnails button.active{border-color:var(--color-accent)} .gallery-caption,.wa-caption{color:var(--color-muted)} .modal-details>.eyebrow{color:var(--color-accent-strong)} .detail-price{border-color:var(--color-border)} .detail-price>span,.detail-price small{color:var(--color-muted)} .detail-price strong{color:var(--color-primary)} dt{color:var(--color-muted)} .product-note{background:var(--color-background);color:var(--color-text-soft);border-radius:var(--radius-sm);border-left:3px solid var(--color-highlight)} .offer-form label span{color:var(--color-muted)} .offer-form>div{border-color:var(--color-border-strong);border-radius:var(--radius-sm);overflow:hidden;background:var(--color-surface);transition:border-color var(--speed) ease,box-shadow var(--speed) ease} .offer-form>div:focus-within{border-color:var(--color-accent);box-shadow:var(--focus-ring)} .offer-form input:focus-visible{outline:0} .currency{color:var(--color-muted)} .offer-form button{background:var(--color-primary);color:var(--color-white)} .offer-form button:hover{background:var(--color-secondary)} .detail-photo-link{color:var(--color-primary)} .detail-photo-link:hover{color:var(--color-accent-strong)} .detail-photo-link .icon:first-child{color:var(--color-accent)} .share-row{border-top-color:var(--color-border)} .share-row button{border-color:var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-soft);background:var(--color-surface)} .share-row button:hover{border-color:var(--color-accent);color:var(--color-accent-strong)} .modal-shipping{border-top-color:var(--color-border)} .modal-shipping>.icon{color:var(--color-accent)} .modal-shipping small{color:var(--color-muted)} .zoom-dialog{background:var(--color-primary-deep);color:var(--color-white)} .source-credit{color:var(--color-muted)} .standalone-product{border-color:var(--color-border);border-radius:var(--radius-lg);overflow:hidden;background:var(--color-surface);box-shadow:var(--shadow-sm)} .product-page-panel{background:var(--color-surface)} .breadcrumb{color:var(--color-muted)} .breadcrumb b{color:var(--color-primary)} .breadcrumb a:hover{color:var(--color-accent-strong)} .page-intro h1 em{color:var(--color-accent-strong)} .page-intro>p:last-child,.collector-guide article p{color:var(--color-muted)} .collector-guide article>span{color:var(--color-accent-strong)} .collector-guide article{border-top:2px solid var(--color-highlight);padding-top:16px} /* ---------- Shipping estimator & package tracking widgets ---------- */ .mcs-ro{color:var(--color-text)} .mcs-ro-eyebrow,.mcs-ro-results-heading>span{color:var(--color-accent-strong)!important} .mcs-ro-intro h2 span,#trackHeading span{color:var(--color-accent)!important} .mcs-ro-intro p:not(.mcs-ro-eyebrow){color:var(--color-muted)} .mcs-ro-pill{background:var(--color-highlight-soft);color:var(--color-primary);border:1px solid var(--color-info-border);border-radius:var(--radius-pill)} .mcs-ro-layout{border-color:var(--color-border);border-radius:var(--radius-lg);overflow:hidden;background:var(--color-surface);box-shadow:var(--shadow-sm)} .mcs-ro-results{background:var(--color-background);border-color:var(--color-border)} .mcs-ro-origin{background:var(--color-highlight-soft);border-left-color:var(--color-accent);border-radius:0 var(--radius-sm) var(--radius-sm) 0} .mcs-ro-origin small,.mcs-ro-info small{color:var(--color-accent-strong)} .mcs-ro-origin span,.mcs-ro-results-heading p,.mcs-ro-rate small,.mcs-ro-disclaimer,.mcs-ro-hint{color:var(--color-muted)} .mcs-ro input,.mcs-ro select{border-color:var(--color-border-strong);border-radius:var(--radius-sm);color:var(--color-text);transition:border-color var(--speed) ease,box-shadow var(--speed) ease} .mcs-ro input:focus,.mcs-ro select:focus,#lacak-paket #mcsTrackForm :is(input,select):focus{outline:0;border-color:var(--color-accent);box-shadow:var(--focus-ring)} .mcs-ro-button{border-radius:var(--radius-sm);transition:background-color var(--speed) ease,box-shadow var(--speed) ease} .mcs-ro-button-dark{background:var(--color-primary);color:var(--color-white)} .mcs-ro-button-dark:hover:not(:disabled){background:var(--color-secondary)} .mcs-ro-button-red{background:var(--color-highlight);color:var(--color-primary);box-shadow:inset 0 0 0 1px rgb(var(--rgb-accent) / .45)} .mcs-ro-button-red:hover:not(:disabled){background:var(--color-highlight-hover)} .mcs-ro-button:disabled{opacity:1;background:var(--color-disabled-bg);color:var(--color-disabled-text);box-shadow:none} .mcs-ro-info>div{border-color:var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface)} .mcs-ro-message{color:var(--color-text-soft)} .mcs-ro-empty{border-color:var(--color-border-strong);border-radius:var(--radius-sm);color:var(--color-muted);background:var(--color-surface)} .mcs-ro-rate{border-color:var(--color-border);border-radius:var(--radius-sm);transition:border-color var(--speed) ease} .mcs-ro-rate:hover{border-color:rgb(var(--rgb-accent) / .55)} .mcs-ro-rate strong{color:var(--color-primary)} .mcs-ro-suggestions{border-color:var(--color-border);border-radius:var(--radius-sm);box-shadow:var(--shadow-md)} .mcs-ro-option{color:var(--color-text);border-bottom-color:var(--color-border)} .mcs-ro-option:hover,.mcs-ro-option:focus-visible,.mcs-ro-option[aria-selected="true"]{background:var(--color-highlight-soft);color:var(--color-accent-strong)} .mcs-ro-suggestions-note{background:var(--color-background);color:var(--color-muted)} .mcs-ro-location-selected{border-color:var(--color-accent)!important;background:var(--color-highlight-soft)!important} /* ---------- Checkout page header/footer (shares .site-header) ---------- */ .ms-check-header>a:last-child{color:var(--color-on-dark-muted);font-weight:600} .ms-check-header>a:last-child:hover{color:var(--color-highlight)} footer.ms-check-footer{background:none;isolation:auto;color:var(--color-muted);border-top:1px solid var(--color-border)} footer.ms-check-footer::before{display:none} /* ---------- Motion preferences ---------- */ @media(prefers-reduced-motion:reduce){.product-card:hover,.button:hover{transform:none}}