:root{ --bg:#050508;--bg-soft:#090a10;--panel:#0d0f17;--panel-2:#11131d;--line:rgba(255,255,255,.09);--line-strong:rgba(150,168,255,.22); --text:#f7f8fc;--muted:#9aa0b1;--dim:#6f7483;--blue:#6b7cff;--violet:#a564ff;--cyan:#7fe5ff;--green:#57e5a7; --gradient:linear-gradient(115deg,#8fdcff 0%,#7777ff 42%,#b16cff 72%,#f7fbff 100%);--frame:min(1440px,calc(100vw - 64px));--radius:28px; } *{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Manrope,Inter,Arial,sans-serif;overflow-x:hidden}button,input,select{font:inherit}button,a{color:inherit}button{cursor:pointer}a{text-decoration:none}svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.frame{width:var(--frame);margin-inline:auto}.site-shell{min-height:100vh;position:relative;isolation:isolate;background:radial-gradient(circle at 50% -20%,rgba(79,90,194,.14),transparent 34%),var(--bg)}.page-glow{position:fixed;z-index:-1;pointer-events:none;filter:blur(120px);opacity:.22;border-radius:50%}.page-glow--one{width:460px;height:460px;background:#5549ff;top:18%;right:-260px}.page-glow--two{width:380px;height:380px;background:#7040d9;top:62%;left:-250px}.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}.reveal.visible{opacity:1;transform:none} /* Intro */ .intro{position:fixed;inset:0;z-index:9999;background:#020204;overflow:hidden;display:grid;place-items:center;transition:opacity .36s ease,visibility .36s ease}.intro.is-finished{opacity:0;visibility:hidden}.intro__skip{position:absolute;right:32px;top:28px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.04);color:#b9bdca;border-radius:999px;padding:12px 18px;z-index:10;font-size:13px;letter-spacing:.08em;text-transform:uppercase}.intro__noise{position:absolute;inset:0;opacity:.09;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");mix-blend-mode:soft-light}.intro__stage{position:relative;width:min(780px,92vw);height:460px;display:grid;place-items:center;perspective:900px}.intro__spark{position:absolute;width:4px;height:4px;background:#fff;border-radius:50%;box-shadow:0 0 16px #fff,0 0 48px #788aff,0 0 110px #744fff;animation:introSpark 2.15s cubic-bezier(.16,.8,.18,1) both}.intro__portal{position:absolute;width:220px;height:220px;opacity:0;animation:introPortal 2.15s cubic-bezier(.16,.8,.18,1) both}.intro__portal i{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(212,225,255,.78);box-shadow:inset 0 0 24px rgba(153,170,255,.5),0 0 18px #9fb2ff,0 0 72px rgba(108,92,255,.8)}.intro__portal i:nth-child(2){inset:14px;border-color:rgba(155,118,255,.7);animation:spin 2.4s linear infinite}.intro__portal i:nth-child(3){inset:28px;border-style:dashed;border-color:rgba(255,255,255,.42);animation:spinReverse 3s linear infinite}.intro__wordmark{display:flex;align-items:center;gap:.015em;font-weight:800;font-size:clamp(56px,9vw,112px);letter-spacing:.12em;margin-left:.12em;opacity:0;filter:blur(18px);transform:scale(.92);animation:introWord 2.15s cubic-bezier(.16,.8,.18,1) both}.intro__wordmark span{display:inline-block}.intro__o{color:transparent;background:var(--gradient);background-clip:text;text-shadow:0 0 35px rgba(130,126,255,.6)}.intro__tagline{position:absolute;top:68%;font-size:11px;letter-spacing:.44em;color:#b6b9c6;opacity:0;animation:introTag 2.15s ease both}.intro__streak{position:absolute;width:55vw;height:1px;background:linear-gradient(90deg,transparent,#9bb2ff,transparent);opacity:0;filter:blur(.4px)}.intro__streak--a{transform:rotate(-13deg);animation:introStreakA 2.15s ease both}.intro__streak--b{transform:rotate(16deg);animation:introStreakB 2.15s ease both}.intro__flash{position:absolute;inset:0;background:white;opacity:0;pointer-events:none;animation:introFlash 2.15s ease both}@keyframes introSpark{0%,10%{transform:scale(0);opacity:0}18%{opacity:1;transform:scale(1)}45%{transform:scale(9);opacity:1}74%{opacity:.9;transform:scale(2)}100%{transform:scale(350);opacity:0}}@keyframes introPortal{0%,18%{opacity:0;transform:scale(.02) rotateX(70deg)}38%{opacity:1;transform:scale(.42) rotateX(0)}68%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(6)}}@keyframes introWord{0%,36%{opacity:0;filter:blur(20px);transform:scale(.88) translateZ(-120px)}55%{opacity:1;filter:blur(0);transform:scale(1) translateZ(0)}78%{opacity:1}100%{opacity:0;filter:blur(8px);transform:scale(1.7)}}@keyframes introTag{0%,52%{opacity:0;transform:translateY(8px)}65%,82%{opacity:.75;transform:none}100%{opacity:0}}@keyframes introStreakA{0%,25%{opacity:0;transform:translateX(-90vw) rotate(-13deg)}43%{opacity:.6}60%,100%{opacity:0;transform:translateX(100vw) rotate(-13deg)}}@keyframes introStreakB{0%,42%{opacity:0;transform:translateX(90vw) rotate(16deg)}60%{opacity:.45}76%,100%{opacity:0;transform:translateX(-100vw) rotate(16deg)}}@keyframes introFlash{0%,88%{opacity:0}93%{opacity:.75}100%{opacity:0}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes spinReverse{to{transform:rotate(-360deg)}} /* Header */ .topbar{position:fixed;z-index:90;top:0;left:0;right:0;height:86px;display:flex;align-items:center;padding:0 max(32px,calc((100vw - 1440px)/2));background:linear-gradient(180deg,rgba(5,5,8,.92),rgba(5,5,8,.58),transparent);backdrop-filter:blur(18px);transition:height .3s ease,background .3s ease,border-color .3s ease;border-bottom:1px solid transparent}.topbar.scrolled{height:72px;background:rgba(5,5,8,.86);border-bottom-color:var(--line)}.brand{display:inline-flex;align-items:center;flex:none}.brand__text{font-size:23px;letter-spacing:.15em;font-weight:800}.brand__portal{color:transparent;background:var(--gradient);background-clip:text;text-shadow:0 0 20px rgba(122,124,255,.45)}.main-nav{margin-left:64px;display:flex;gap:30px}.main-nav a{font-size:14px;font-weight:600;color:#afb3c0;transition:.2s}.main-nav a:hover{color:white}.topbar__actions{margin-left:auto;display:flex;align-items:center;gap:10px}.topbar__language,.icon-button,.profile-button{height:46px;border:1px solid var(--line);background:rgba(255,255,255,.035);border-radius:15px;color:#d7d9e2}.topbar__language{width:54px;font-size:13px;font-weight:700}.icon-button,.profile-button{width:46px;display:grid;place-items:center;position:relative}.icon-button svg,.profile-button svg{width:20px;height:20px}.icon-button--counter b{position:absolute;right:-3px;top:-5px;min-width:18px;height:18px;border-radius:9px;background:#fff;color:#07070a;font-size:10px;display:grid;place-items:center;padding-inline:4px}.cart-button{height:46px;border:0;border-radius:15px;padding:0 17px 0 20px;background:white;color:#08090d;display:flex;align-items:center;gap:12px;font-weight:800}.cart-button>svg{display:none;width:19px;height:19px}.cart-button b{min-width:25px;height:25px;border-radius:9px;background:#11131a;color:#fff;display:grid;place-items:center;font-size:11px}.profile-button__dot{position:absolute;right:7px;top:7px;width:7px;height:7px;border-radius:50%;background:#57e5a7;box-shadow:0 0 10px #57e5a7}.menu-button{display:none;width:46px;height:46px;border:1px solid var(--line);background:transparent;border-radius:15px}.menu-button span{display:block;width:18px;height:1px;background:white;margin:5px auto} /* Hero */ .hero{min-height:860px;padding-top:170px;display:grid;grid-template-columns:minmax(0,1.04fr) minmax(500px,.96fr);gap:62px;align-items:center}.section-kicker{display:flex;align-items:center;gap:11px;color:#a8adbc;font-size:11px;font-weight:700;letter-spacing:.19em}.section-kicker span{width:27px;height:1px;background:linear-gradient(90deg,#91ddff,#916cff)}.hero h1,.section-heading h2,.brand-campaign h2{margin:26px 0 22px;font-size:clamp(58px,6vw,92px);line-height:.96;letter-spacing:-.065em;font-weight:700}.hero h1 em,.section-heading h2 em,.brand-campaign h2 em{font-style:normal;color:transparent;background:var(--gradient);background-clip:text}.hero__copy>p{max-width:700px;font-size:19px;line-height:1.65;color:#aeb3c2;margin:0 0 34px}.search-launch{width:min(720px,100%);height:68px;border:1px solid rgba(175,187,255,.2);border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.025));display:flex;align-items:center;padding:0 17px 0 22px;box-shadow:0 20px 80px rgba(31,33,70,.18),inset 0 1px 0 rgba(255,255,255,.07);color:#b8bdcb;text-align:left;transition:.25s}.search-launch:hover{border-color:rgba(152,166,255,.45);transform:translateY(-2px);box-shadow:0 22px 100px rgba(66,62,163,.25)}.search-launch svg{width:23px;height:23px;margin-right:17px;color:white}.search-launch span{font-size:16px}.search-launch kbd{margin-left:auto;color:#7e8494;border:1px solid var(--line);border-radius:10px;padding:8px 10px;font-size:11px;background:#08090d}.hero__queries{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:17px}.hero__queries>span{font-size:12px;color:#6f7483;margin-right:3px}.hero__queries button{border:1px solid var(--line);background:transparent;border-radius:999px;padding:9px 13px;font-size:12px;color:#b7bbc8;transition:.2s}.hero__queries button:hover{color:white;border-color:rgba(149,165,255,.35);background:rgba(255,255,255,.04)}.hero__proof{display:flex;gap:38px;margin-top:48px}.hero__proof div{display:flex;flex-direction:column}.hero__proof strong{font-size:20px}.hero__proof span{font-size:11px;color:#757b8b;margin-top:5px}.hero__visual{height:650px;position:relative;display:grid;place-items:center;perspective:1100px}.hero-portal{width:480px;height:480px;position:relative;display:grid;place-items:center;transform-style:preserve-3d}.hero-portal__halo{position:absolute;inset:25%;border-radius:50%;background:rgba(111,94,255,.7);filter:blur(80px);animation:portalPulse 4s ease-in-out infinite}.hero-portal__ring{position:absolute;border-radius:50%;border:1px solid rgba(209,218,255,.45);box-shadow:inset 0 0 30px rgba(121,142,255,.32),0 0 22px rgba(120,128,255,.52),0 0 90px rgba(91,65,212,.32)}.hero-portal__ring--outer{inset:0;animation:portalRotate 14s linear infinite}.hero-portal__ring--middle{inset:36px;border-style:dashed;border-color:rgba(170,126,255,.48);animation:portalRotateReverse 18s linear infinite}.hero-portal__ring--inner{inset:74px;border-color:rgba(235,241,255,.55);box-shadow:inset 0 0 50px rgba(85,95,211,.35),0 0 40px rgba(148,110,255,.42)}.hero-portal__core{width:260px;height:260px;border-radius:50%;background:radial-gradient(circle at 44% 40%,rgba(165,202,255,.17),rgba(27,27,56,.56) 46%,rgba(6,6,10,.95) 72%);border:1px solid rgba(255,255,255,.11);display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:inset 0 0 60px rgba(128,102,255,.22)}.hero-portal__core span{font-size:25px;font-weight:800;letter-spacing:.18em}.hero-portal__core small{font-size:8px;letter-spacing:.23em;color:#7f8597;margin-top:10px}@keyframes portalPulse{50%{transform:scale(1.25);opacity:.7}}@keyframes portalRotate{to{transform:rotate(360deg)}}@keyframes portalRotateReverse{to{transform:rotate(-360deg)}}.floating-product{position:absolute;width:250px;min-height:98px;border:1px solid rgba(255,255,255,.13);border-radius:24px;background:linear-gradient(135deg,rgba(25,27,39,.92),rgba(10,11,17,.86));backdrop-filter:blur(24px);padding:16px;display:flex;align-items:center;gap:14px;text-align:left;box-shadow:0 24px 70px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.07);transition:.28s;animation:floatProduct 5s ease-in-out infinite}.floating-product:hover{transform:translateY(-7px) scale(1.02)!important;border-color:rgba(155,170,255,.43)}.floating-product__symbol{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;font-weight:800;font-size:21px;background:linear-gradient(145deg,rgba(255,255,255,.16),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.12)}.floating-product__body{display:flex;flex-direction:column;min-width:0}.floating-product__body small{font-size:9px;letter-spacing:.16em;color:#878d9e}.floating-product__body strong{font-size:14px;margin-top:4px;white-space:nowrap}.floating-product__body em{font-size:13px;color:#d7dbeb;font-style:normal;margin-top:7px}.floating-product--steam{left:-12px;top:110px;animation-delay:-1.1s}.floating-product--telegram{right:-12px;top:245px;animation-delay:-2.6s}.floating-product--pubg{left:45px;bottom:70px;animation-delay:-3.5s}@keyframes floatProduct{0%,100%{transform:translateY(0)}50%{transform:translateY(-11px)}}.hero__status{position:absolute;right:25px;bottom:55px;border:1px solid var(--line);background:rgba(9,10,15,.75);backdrop-filter:blur(18px);border-radius:16px;padding:11px 14px;display:flex;align-items:center;gap:9px;font-size:10px;color:#959bab}.hero__status i{width:7px;height:7px;background:var(--green);border-radius:50%;box-shadow:0 0 12px var(--green)}.hero__status time{color:#626878;margin-left:8px} .brand-rail{overflow:hidden;border-block:1px solid var(--line);background:rgba(255,255,255,.018)}.brand-rail__track{height:88px;display:flex;align-items:center;gap:64px;width:max-content;animation:rail 30s linear infinite}.brand-rail__track span{font-size:15px;font-weight:800;letter-spacing:.12em;color:#454a58}.brand-rail__track span:nth-child(3n+1){color:#686e7f}@keyframes rail{to{transform:translateX(-50%)}} /* Sections */ .section{padding-block:135px}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:48px;margin-bottom:52px}.section-heading h2{font-size:clamp(44px,5vw,72px);margin:22px 0 0}.section-heading>p{max-width:520px;color:#8d93a4;font-size:16px;line-height:1.75;margin:0 0 8px}.text-link{font-size:14px;font-weight:700;color:#ccd0dc;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.24)}.text-link span{margin-left:8px}.service-showcase{display:grid;grid-template-columns:1.35fr .85fr .85fr;grid-template-rows:repeat(2,260px);gap:18px}.service-card{border:1px solid var(--line);border-radius:30px;background:linear-gradient(145deg,var(--service-bg,rgba(255,255,255,.05)),rgba(9,10,15,.72) 68%);position:relative;overflow:hidden;padding:28px;text-align:left;display:flex;flex-direction:column;justify-content:flex-end;isolation:isolate;transition:.3s}.service-card:first-child{grid-row:span 2}.service-card:hover{transform:translateY(-6px);border-color:rgba(170,180,255,.32)}.service-card:before{content:"";position:absolute;width:250px;height:250px;border-radius:50%;background:var(--service-accent);filter:blur(90px);opacity:.24;right:-80px;top:-70px;z-index:-1}.service-card__mark{position:absolute;right:27px;top:26px;width:58px;height:58px;border:1px solid rgba(255,255,255,.15);border-radius:18px;display:grid;place-items:center;font-size:22px;font-weight:800;background:rgba(255,255,255,.045)}.service-card__eyebrow{font-size:10px;letter-spacing:.15em;color:#9298a8;margin-bottom:10px}.service-card h3{font-size:26px;line-height:1.15;margin:0 0 10px}.service-card:first-child h3{font-size:41px;max-width:450px}.service-card p{font-size:13px;color:#9096a7;margin:0 0 20px}.service-card__footer{display:flex;align-items:center;justify-content:space-between}.service-card__footer strong{font-size:20px}.service-card__footer span{width:42px;height:42px;border-radius:14px;background:white;color:#08090d;display:grid;place-items:center;font-size:17px}.category-board{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.category-tile{min-height:270px;border:1px solid var(--line);border-radius:28px;background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.018));padding:25px;text-align:left;position:relative;display:flex;flex-direction:column;transition:.28s;overflow:hidden}.category-tile--wide{grid-column:span 2}.category-tile:hover{transform:translateY(-5px);border-color:rgba(151,166,255,.33);background:linear-gradient(145deg,rgba(100,105,255,.09),rgba(255,255,255,.02))}.category-tile__number{font-size:10px;color:#616777;letter-spacing:.12em}.category-tile__icon{position:absolute;right:24px;top:22px;width:52px;height:52px;border-radius:17px;border:1px solid var(--line);display:grid;place-items:center;font-size:20px}.category-tile div{margin-top:auto}.category-tile h3{font-size:23px;margin:0 0 9px}.category-tile p{font-size:13px;line-height:1.6;color:#8c92a3;margin:0;max-width:320px}.category-tile b{font-size:10px;color:#696f80;font-weight:600;margin-top:20px}.category-tile>i{position:absolute;right:24px;bottom:22px;font-style:normal;color:#9097a9} /* Catalogue */ .catalog-section{background:linear-gradient(180deg,transparent,rgba(12,13,20,.72) 18%,rgba(9,10,15,.86) 82%,transparent);padding-bottom:145px}.section-heading--catalog{padding-top:20px}.catalog-shell{display:grid;grid-template-columns:286px 1fr;gap:18px;align-items:start}.catalog-filters{position:sticky;top:92px;border:1px solid var(--line);border-radius:26px;background:rgba(11,12,18,.75);backdrop-filter:blur(20px);padding:21px}.catalog-filters__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.catalog-filters__head strong{font-size:17px}.catalog-filters__head button{border:0;background:transparent;color:#747b8b;font-size:11px}.filter-search{height:48px;border:1px solid var(--line);border-radius:15px;display:flex;align-items:center;padding:0 14px;margin-bottom:22px;background:#08090e}.filter-search svg{width:17px;margin-right:10px;color:#7d8494}.filter-search input{border:0;outline:0;background:transparent;color:white;width:100%;font-size:12px}.filter-group{border-top:1px solid var(--line);padding-top:18px;margin-top:18px}.filter-group__title{width:100%;display:flex;align-items:center;justify-content:space-between;border:0;background:transparent;padding:0;color:#e4e6ed;font-size:13px;font-weight:700}.filter-group__title i{font-style:normal;color:#686e7d}.filter-options{display:grid;gap:11px;margin-top:15px}.filter-options--scroll{max-height:185px;overflow:auto;padding-right:5px}.filter-option{display:flex;align-items:center;gap:10px;font-size:12px;color:#969cab;cursor:pointer}.filter-option input{display:none}.filter-option__box{width:18px;height:18px;border:1px solid rgba(255,255,255,.14);border-radius:6px;background:#08090e;display:grid;place-items:center}.filter-option input:checked+.filter-option__box{background:linear-gradient(135deg,#729cff,#9e62ff);border-color:transparent}.filter-option input:checked+.filter-option__box:after{content:"✓";font-size:11px;color:white}.filter-option b{margin-left:auto;color:#5f6575;font-size:10px;font-weight:600}.filter-apply{display:none}.catalog-content{min-width:0}.catalog-toolbar{min-height:70px;display:flex;align-items:center;justify-content:space-between;border:1px solid var(--line);background:rgba(11,12,18,.78);border-radius:22px;padding:12px 14px 12px 22px;margin-bottom:18px}.catalog-toolbar>div:first-child{display:flex;flex-direction:column;gap:4px}.catalog-toolbar strong{font-size:17px}.catalog-toolbar>div:first-child span{font-size:10px;color:#6f7585}.catalog-toolbar__actions{display:flex;align-items:center;gap:9px}.sort-control{height:46px;border:1px solid var(--line);border-radius:14px;display:flex;align-items:center;padding:0 13px}.sort-control span{font-size:10px;color:#6f7585;margin-right:8px}.sort-control select{border:0;outline:0;background:#0b0c12;color:#d8dae4;font-size:12px}.view-toggle{height:46px;border:1px solid var(--line);border-radius:14px;padding:4px;display:flex}.view-toggle button{width:38px;border:0;border-radius:10px;background:transparent;color:#696f7e}.view-toggle button.active{background:rgba(255,255,255,.08);color:white}.mobile-filter-button{display:none}.product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.product-grid.compact{grid-template-columns:repeat(2,minmax(0,1fr))}.product-card{border:1px solid var(--line);border-radius:25px;background:linear-gradient(155deg,rgba(255,255,255,.047),rgba(255,255,255,.015));overflow:hidden;transition:transform .3s cubic-bezier(.2,.8,.2,1),border-color .3s,box-shadow .3s;position:relative}.product-card:hover{transform:translateY(-7px);border-color:color-mix(in srgb,var(--accent) 42%,rgba(255,255,255,.18));box-shadow:0 24px 80px rgba(0,0,0,.34),0 0 38px color-mix(in srgb,var(--accent) 12%,transparent)}.product-card__visual{height:220px;margin:8px;border-radius:19px;position:relative;overflow:hidden;background:radial-gradient(circle at 75% 18%,color-mix(in srgb,var(--accent) 30%,transparent),transparent 34%),linear-gradient(145deg,color-mix(in srgb,var(--accent) 10%,#141722),#08090d 76%);display:flex;align-items:flex-end;padding:20px}.product-card__visual:before{content:"";position:absolute;width:180px;height:180px;border-radius:50%;right:-40px;top:-55px;border:1px solid color-mix(in srgb,var(--accent) 48%,transparent);box-shadow:0 0 30px color-mix(in srgb,var(--accent) 28%,transparent),inset 0 0 30px color-mix(in srgb,var(--accent) 18%,transparent)}.product-card__visual:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(4,5,8,.8));pointer-events:none}.product-card__brand{position:relative;z-index:1;font-size:clamp(25px,2vw,40px);line-height:.96;font-weight:800;letter-spacing:-.05em;max-width:85%;text-shadow:0 7px 30px rgba(0,0,0,.42)}.product-card__symbol{position:absolute;right:24px;top:23px;z-index:2;width:48px;height:48px;border:1px solid rgba(255,255,255,.16);border-radius:16px;background:rgba(5,6,10,.34);backdrop-filter:blur(16px);display:grid;place-items:center;font-size:18px;font-weight:800}.product-card__favorite{position:absolute;left:16px;top:16px;z-index:4;width:40px;height:40px;border-radius:13px;border:1px solid rgba(255,255,255,.12);background:rgba(6,7,11,.52);backdrop-filter:blur(16px);display:grid;place-items:center;color:#c7cad4;font-size:17px}.product-card__favorite.active{background:white;color:#090a0e}.product-card__body{padding:12px 17px 18px}.product-card__badges{display:flex;gap:6px;margin-bottom:11px;min-height:22px}.badge{border:1px solid var(--line);border-radius:999px;padding:5px 8px;font-size:8px;font-weight:700;letter-spacing:.06em;color:#9ca2b3;text-transform:uppercase}.badge--accent{border-color:color-mix(in srgb,var(--accent) 40%,transparent);color:color-mix(in srgb,var(--accent) 75%,white)}.product-card h3{font-size:15px;line-height:1.35;margin:0;min-height:41px}.product-card__meta{font-size:10px;color:#73798a;margin-top:7px}.product-card__bottom{display:flex;align-items:flex-end;justify-content:space-between;margin-top:18px;gap:12px}.product-card__price{display:flex;flex-direction:column}.product-card__price span{font-size:9px;color:#666c7c}.product-card__price strong{font-size:20px;margin-top:3px}.product-card__buy{height:43px;border:0;border-radius:13px;background:white;color:#07080c;font-size:11px;font-weight:800;padding:0 14px;transition:.2s}.product-card__buy:hover{transform:scale(1.04)}.product-grid.compact .product-card{display:grid;grid-template-columns:210px 1fr}.product-grid.compact .product-card__visual{height:180px}.product-grid.compact .product-card__body{padding:24px}.catalog-more{text-align:center;padding-top:42px}.catalog-more button{height:56px;border:1px solid var(--line);border-radius:17px;background:rgba(255,255,255,.04);color:white;padding:0 30px;font-size:13px;font-weight:700}.catalog-more button span{margin-left:13px}.catalog-more p{font-size:10px;color:#646a79;margin-top:13px} /* Campaign + advantages */ .brand-campaign{min-height:540px;border-radius:38px;overflow:hidden;background:radial-gradient(circle at 82% 34%,rgba(106,93,255,.5),transparent 27%),linear-gradient(135deg,#e7eefc 0%,#aab9db 46%,#6879a4 100%);color:#08090d;display:grid;grid-template-columns:1.15fr .85fr;position:relative}.brand-campaign__copy{padding:70px 72px;position:relative;z-index:2}.section-kicker--light{color:#343b4d}.section-kicker--light span{background:#11141d}.brand-campaign h2{font-size:clamp(44px,5vw,72px);margin:23px 0}.brand-campaign h2 em{background:linear-gradient(105deg,#243052,#5266b6);background-clip:text}.brand-campaign p{font-size:16px;line-height:1.7;max-width:600px;color:#374054}.brand-campaign button{height:56px;border:0;border-radius:17px;background:#090a0e;color:white;padding:0 24px;font-weight:800;margin-top:24px}.brand-campaign button span{margin-left:15px}.brand-campaign__visual{position:relative;display:grid;place-items:center;overflow:hidden}.brand-campaign__visual strong{font-size:180px;line-height:1;color:rgba(8,9,13,.88);z-index:2}.brand-campaign__visual>span{position:absolute;bottom:55px;right:55px;font-size:11px;font-weight:800;letter-spacing:.22em;line-height:1.6;text-align:right}.campaign-orbit{position:absolute;border-radius:50%;border:1px solid rgba(12,15,25,.34)}.campaign-orbit--one{width:420px;height:420px}.campaign-orbit--two{width:310px;height:310px;border-style:dashed;animation:portalRotate 15s linear infinite}.advantage-grid{display:grid;grid-template-columns:repeat(4,1fr);border-block:1px solid var(--line)}.advantage-grid article{padding:34px 34px 46px;border-right:1px solid var(--line)}.advantage-grid article:last-child{border-right:0}.advantage-grid span{font-size:9px;color:#606676}.advantage-grid h3{font-size:19px;margin:45px 0 12px}.advantage-grid p{color:#858b9c;font-size:13px;line-height:1.65;margin:0} /* Footer */ .footer{border-top:1px solid var(--line);padding:75px 0 30px;background:#040406}.footer__inner{display:grid;grid-template-columns:1.8fr repeat(3,1fr);gap:70px}.footer__brand p{color:#777d8e;max-width:330px;font-size:13px;line-height:1.7;margin-top:20px}.footer__inner>div:not(.footer__brand){display:flex;flex-direction:column;align-items:flex-start;gap:13px}.footer__inner strong{font-size:12px;margin-bottom:10px}.footer__inner a,.footer__inner button{border:0;background:transparent;padding:0;color:#777d8e;font-size:12px}.footer__inner a:hover,.footer__inner button:hover{color:white}.footer__bottom{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:23px;margin-top:60px;color:#515665;font-size:9px;letter-spacing:.12em} /* Overlay / drawers / modal */ .search-overlay{position:fixed;z-index:200;inset:0;background:rgba(4,4,7,.94);backdrop-filter:blur(28px);opacity:0;visibility:hidden;transition:.25s;overflow:auto}.search-overlay.open{opacity:1;visibility:visible}.overlay-close{position:fixed;right:32px;top:28px;width:48px;height:48px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.04);color:white;font-size:25px}.search-overlay__inner{width:min(1000px,calc(100vw - 48px));margin:120px auto}.global-search{height:84px;margin-top:28px;border-bottom:1px solid rgba(255,255,255,.25);display:flex;align-items:center}.global-search svg{width:31px;margin-right:20px}.global-search input{flex:1;background:transparent;border:0;outline:0;color:white;font-size:31px;font-weight:600}.global-search kbd{border:1px solid var(--line);border-radius:9px;padding:8px 10px;color:#656b7b;font-size:10px}.search-overlay__meta{display:flex;justify-content:space-between;margin:24px 0;color:#656b7a;font-size:11px}.search-results{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.search-result{min-height:98px;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.025);padding:13px;display:flex;align-items:center;text-align:left;gap:15px}.search-result__art{width:72px;height:72px;border-radius:15px;background:radial-gradient(circle at 70% 20%,var(--accent),transparent 46%),#11131b;display:grid;place-items:center;font-weight:800;font-size:20px}.search-result div{display:flex;flex-direction:column}.search-result strong{font-size:13px}.search-result span{font-size:10px;color:#777d8c;margin-top:7px}.search-result b{margin-left:auto;font-size:13px}.drawer{position:fixed;inset:0;z-index:210;visibility:hidden}.drawer.open{visibility:visible}.drawer__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.62);opacity:0;transition:.25s}.drawer.open .drawer__backdrop{opacity:1}.drawer__panel{position:absolute;right:0;top:0;bottom:0;width:min(470px,100vw);background:#090a0f;border-left:1px solid var(--line);transform:translateX(100%);transition:.35s cubic-bezier(.2,.8,.2,1);display:flex;flex-direction:column}.drawer.open .drawer__panel{transform:none}.drawer__panel header{height:100px;padding:0 28px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.drawer__panel header small{font-size:8px;letter-spacing:.18em;color:#626878}.drawer__panel h3{font-size:24px;margin:5px 0 0}.drawer__panel header button{width:44px;height:44px;border:1px solid var(--line);border-radius:14px;background:transparent;color:white;font-size:22px}.drawer__content{padding:22px;overflow:auto;flex:1}.drawer__footer{padding:22px;border-top:1px solid var(--line)}.drawer__footer>div{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:18px}.drawer__footer span{color:#7b8191;font-size:12px}.drawer__footer strong{font-size:25px}.drawer__footer button{width:100%;height:56px;border:0;border-radius:16px;background:white;color:#08090d;font-weight:800}.drawer-item{display:grid;grid-template-columns:74px 1fr auto;gap:14px;padding:12px;border:1px solid var(--line);border-radius:18px;margin-bottom:10px}.drawer-item__art{height:74px;border-radius:14px;background:radial-gradient(circle at 70% 20%,var(--accent),transparent 44%),#151720;display:grid;place-items:center;font-weight:800}.drawer-item h4{font-size:12px;margin:5px 0 8px}.drawer-item p{font-size:9px;color:#777d8d;margin:0}.drawer-item strong{font-size:12px}.drawer-item button{align-self:start;border:0;background:transparent;color:#686e7d}.empty-state{padding:70px 25px;text-align:center;color:#777d8d}.empty-state strong{display:block;color:white;font-size:19px;margin-bottom:10px}.product-modal{position:fixed;inset:0;z-index:230;visibility:hidden}.product-modal.open{visibility:visible}.product-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.74);backdrop-filter:blur(18px);opacity:0;transition:.25s}.product-modal.open .product-modal__backdrop{opacity:1}.product-modal__card{position:absolute;left:50%;top:50%;width:min(1050px,calc(100vw - 48px));max-height:calc(100vh - 48px);overflow:auto;transform:translate(-50%,-46%) scale(.96);opacity:0;transition:.35s cubic-bezier(.2,.8,.2,1);border:1px solid var(--line-strong);border-radius:32px;background:#0a0b11;display:grid;grid-template-columns:.9fr 1.1fr}.product-modal.open .product-modal__card{transform:translate(-50%,-50%) scale(1);opacity:1}.product-modal__close{position:absolute;z-index:5;right:18px;top:18px;width:44px;height:44px;border:1px solid var(--line);border-radius:14px;background:rgba(6,7,10,.6);color:white;font-size:22px}.product-modal__visual{min-height:650px;position:relative;display:flex;align-items:flex-end;padding:42px;background:radial-gradient(circle at 70% 18%,color-mix(in srgb,var(--accent) 35%,transparent),transparent 35%),linear-gradient(145deg,color-mix(in srgb,var(--accent) 14%,#161925),#07080c 70%);overflow:hidden}.product-modal__visual:before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;right:-110px;top:-120px;border:1px solid color-mix(in srgb,var(--accent) 55%,transparent);box-shadow:0 0 75px color-mix(in srgb,var(--accent) 23%,transparent),inset 0 0 60px color-mix(in srgb,var(--accent) 15%,transparent)}.product-modal__visual strong{position:relative;font-size:58px;line-height:.94;letter-spacing:-.06em;max-width:90%;z-index:2}.product-modal__content{padding:48px}.product-modal__badges{display:flex;gap:7px}.product-modal__content h2{font-size:40px;line-height:1.1;letter-spacing:-.045em;margin:24px 0 16px}.product-modal__content>p{color:#8d93a4;font-size:14px;line-height:1.7}.product-modal__facts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:28px 0}.product-modal__facts div{border:1px solid var(--line);border-radius:16px;padding:13px}.product-modal__facts span{display:block;font-size:8px;color:#666c7c;text-transform:uppercase;letter-spacing:.09em}.product-modal__facts strong{display:block;font-size:11px;margin-top:7px}.product-modal__facts .available{color:var(--green)}.product-modal__fields{display:grid;gap:11px}.product-field{display:flex;flex-direction:column;gap:7px}.product-field span{font-size:10px;color:#878d9d}.product-field input,.product-field select{height:50px;border:1px solid var(--line);border-radius:14px;background:#07080c;color:white;padding:0 14px;outline:0}.product-modal__buy{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);margin-top:28px;padding-top:24px}.product-modal__buy>div{display:flex;flex-direction:column}.product-modal__buy span{font-size:9px;color:#727889}.product-modal__buy strong{font-size:26px;margin-top:4px}.product-modal__buy small{font-size:8px;color:#5e6473;margin-top:5px}.product-modal__buy button{height:55px;border:0;border-radius:16px;background:white;color:#08090d;padding:0 22px;font-weight:800}.product-page-link{display:block;border-top:1px solid var(--line);padding-top:18px;margin-top:22px;font-size:11px;color:#888f9f}.product-page-link span{float:right}.mobile-menu{position:fixed;inset:0;z-index:220;background:#07080c;padding:24px;transform:translateX(100%);transition:.3s}.mobile-menu.open{transform:none}.mobile-menu__head{display:flex;align-items:center;justify-content:space-between}.mobile-menu__head button{width:44px;height:44px;border:1px solid var(--line);border-radius:14px;background:transparent;color:white;font-size:22px}.mobile-menu nav{display:flex;flex-direction:column;margin-top:70px}.mobile-menu nav a{font-size:30px;font-weight:700;padding:18px 0;border-bottom:1px solid var(--line)}.toast{position:fixed;z-index:300;left:50%;bottom:26px;transform:translate(-50%,20px);opacity:0;background:white;color:#08090d;border-radius:14px;padding:13px 18px;font-size:12px;font-weight:700;transition:.25s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)} @media(max-width:1280px){:root{--frame:min(1180px,calc(100vw - 48px))}.main-nav{gap:18px;margin-left:38px}.main-nav a{font-size:12px}.hero{grid-template-columns:1fr 500px}.product-grid{grid-template-columns:repeat(3,1fr)}.service-showcase{grid-template-columns:1.2fr 1fr}.service-card:first-child{grid-row:auto;grid-column:span 2}.service-showcase{grid-template-rows:repeat(3,240px)}.category-board{grid-template-columns:repeat(3,1fr)}.category-tile--wide{grid-column:span 1}.category-tile:last-child{grid-column:span 2}} @media(max-width:1020px){.main-nav{display:none}.menu-button{display:block}.hero{grid-template-columns:1fr;padding-top:150px}.hero__visual{height:610px}.hero__copy{text-align:center}.hero__copy .section-kicker{justify-content:center}.hero__copy>p{margin-inline:auto}.search-launch{margin-inline:auto}.hero__queries,.hero__proof{justify-content:center}.catalog-shell{grid-template-columns:1fr}.catalog-filters{position:fixed;z-index:180;left:0;top:0;bottom:0;width:min(360px,90vw);border-radius:0;transform:translateX(-100%);transition:.3s;overflow:auto}.catalog-filters.open{transform:none}.filter-apply{display:block;width:100%;height:52px;border:0;border-radius:15px;background:white;color:#08090d;font-weight:800;margin-top:24px}.mobile-filter-button{display:block;height:46px;border:1px solid var(--line);border-radius:14px;background:transparent;color:white;padding:0 14px}.mobile-filter-button span{margin-left:8px}.product-grid{grid-template-columns:repeat(3,1fr)}.brand-campaign{grid-template-columns:1fr}.brand-campaign__visual{min-height:350px}.advantage-grid{grid-template-columns:repeat(2,1fr)}.advantage-grid article:nth-child(2){border-right:0}.advantage-grid article:nth-child(-n+2){border-bottom:1px solid var(--line)}.footer__inner{grid-template-columns:1.4fr repeat(2,1fr)}.footer__inner>div:last-child{display:none}} @media(max-width:760px){:root{--frame:calc(100vw - 28px)}.topbar{height:70px;padding:0 14px}.topbar__language,.icon-button--counter,.profile-button{display:none}.cart-button{height:43px;width:64px;padding:0 10px;justify-content:center;gap:7px}.cart-button>svg{display:block}.cart-button span{display:none}.cart-button b{min-width:20px;height:20px;border-radius:7px;font-size:9px}.brand__text{font-size:19px}.hero{padding-top:120px;min-height:auto;gap:30px}.hero h1{font-size:48px}.hero__copy>p{font-size:16px}.search-launch{height:60px;border-radius:17px;padding-left:16px}.search-launch span{font-size:13px}.search-launch kbd{display:none}.hero__queries{gap:7px}.hero__queries>span{width:100%}.hero__proof{gap:22px;margin-top:35px}.hero__proof strong{font-size:17px}.hero__proof span{font-size:9px}.hero__visual{height:500px;transform:none;margin-inline:0;overflow:hidden}.hero-portal{width:360px;height:360px}.floating-product{width:205px;min-height:86px;padding:13px}.floating-product__symbol{width:46px;height:46px;border-radius:14px}.floating-product--steam{left:4px;top:90px}.floating-product--telegram{right:4px;top:215px}.floating-product--pubg{left:54px;bottom:18px}.brand-rail__track{height:70px;gap:38px}.section{padding-block:90px}.section-heading{align-items:flex-start;flex-direction:column;margin-bottom:35px}.section-heading h2{font-size:43px}.section-heading>p{font-size:14px}.service-showcase{display:flex;overflow:auto;scroll-snap-type:x mandatory;padding-bottom:8px}.service-card,.service-card:first-child{min-width:82vw;height:320px;grid-column:auto;grid-row:auto;scroll-snap-align:start}.service-card:first-child h3{font-size:30px}.category-board{grid-template-columns:1fr}.category-tile,.category-tile--wide,.category-tile:last-child{grid-column:auto;min-height:215px}.catalog-section{padding-top:80px}.catalog-toolbar{align-items:flex-start;gap:14px}.catalog-toolbar__actions{flex-wrap:wrap;justify-content:flex-end}.sort-control span,.view-toggle{display:none}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.product-card{border-radius:20px}.product-card__visual{height:160px;margin:6px;border-radius:15px;padding:13px}.product-card__brand{font-size:23px}.product-card__symbol{right:13px;top:13px;width:38px;height:38px;border-radius:12px;font-size:14px}.product-card__favorite{left:11px;top:11px;width:35px;height:35px;border-radius:11px}.product-card__body{padding:9px 12px 13px}.product-card h3{font-size:12px;min-height:33px}.product-card__meta{font-size:8px}.product-card__price strong{font-size:16px}.product-card__buy{height:38px;padding:0 10px;font-size:9px}.product-grid.compact{grid-template-columns:1fr}.product-grid.compact .product-card{grid-template-columns:130px 1fr}.product-grid.compact .product-card__visual{height:140px}.brand-campaign{border-radius:28px}.brand-campaign__copy{padding:44px 28px}.brand-campaign h2{font-size:43px}.brand-campaign__visual strong{font-size:135px}.advantage-grid{grid-template-columns:1fr}.advantage-grid article{border-right:0!important;border-bottom:1px solid var(--line)}.footer__inner{grid-template-columns:1fr 1fr;gap:42px}.footer__brand{grid-column:span 2}.footer__bottom{flex-direction:column;gap:10px}.search-overlay__inner{margin-top:95px}.global-search{height:68px}.global-search input{font-size:19px}.search-results{grid-template-columns:1fr}.product-modal__card{grid-template-columns:1fr;width:calc(100vw - 20px);max-height:calc(100vh - 20px);border-radius:24px}.product-modal__visual{min-height:310px}.product-modal__visual strong{font-size:41px}.product-modal__content{padding:25px}.product-modal__content h2{font-size:29px}.product-modal__facts{grid-template-columns:1fr 1fr}.product-modal__buy{align-items:flex-start;gap:15px;flex-direction:column}.product-modal__buy button{width:100%}} @media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.intro{display:none}.reveal{opacity:1;transform:none}} /* === strict black-hole redesign patch === */ :root{ --text:#f2f4f7; --muted:#9aa2ad; --line:rgba(255,255,255,.08); --panel:#0e1117; --panel-2:#121620; --accent:#dfeaff; --accent-soft:#94b8ff; --accent-2:#ffffff; --brand-gradient:linear-gradient(135deg,#f8fbff 0%,#d7e7ff 45%,#b8d0ff 100%); } body{background:#050608;color:var(--text)} .site-shell{background: radial-gradient(circle at 72% 22%, rgba(110,145,255,.08), transparent 28%), radial-gradient(circle at 12% 16%, rgba(255,255,255,.04), transparent 18%), #050608;} .page-glow--one,.page-glow--two{display:none} .topbar{background:linear-gradient(180deg,rgba(5,6,8,.78),rgba(5,6,8,.35),transparent);backdrop-filter:blur(10px)} .topbar.scrolled{background:rgba(7,8,12,.82);border-bottom:1px solid rgba(255,255,255,.05)} .brand__text,.main-nav a,.topbar__language,.icon-button,.profile-button{color:#f1f3f6} .main-nav a{opacity:.78} .main-nav a:hover,.main-nav a:focus-visible{opacity:1;color:#fff} .brand__portal{background:var(--brand-gradient);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;color:transparent} .section-kicker,.brand-rail,.service-showcase,#services{display:none !important} .hero{min-height:820px;grid-template-columns:minmax(0,1fr) minmax(480px,560px);align-items:center;gap:42px} .hero__copy{max-width:650px} .hero h1{font-size:clamp(62px,7vw,92px);line-height:.95;letter-spacing:-.06em;margin:0 0 24px} .hero h1 em,.section-heading h2 em{background:var(--brand-gradient);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;color:transparent;font-style:normal} .hero__copy p{font-size:18px;line-height:1.8;color:#b2b9c4;max-width:570px;margin:0 0 28px} .hero__queries--minimal{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px} .hero__queries--minimal span{display:none} .hero__queries--minimal button{height:40px;padding:0 16px;border-radius:999px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);color:#dde4ee;font-weight:600} .hero__queries--minimal button:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.12)} .hero__proof,.hero__status,.floating-product,.hero-portal{display:none !important} .hero__visual{display:flex;align-items:center;justify-content:center;min-height:580px} .blackhole-scene{position:relative;width:min(560px,90vw);aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;transition:transform .25s ease} .blackhole-glow{position:absolute;inset:12%;border-radius:50%;background:radial-gradient(circle at 50% 50%,rgba(130,161,255,.18) 0%, rgba(83,111,190,.14) 22%, rgba(20,24,32,0) 64%);filter:blur(38px);animation:glowPulse 7s ease-in-out infinite} .blackhole-accretion{position:absolute;inset:17%;border-radius:50%;background: conic-gradient(from 0deg, rgba(255,255,255,.0) 0deg, rgba(175,206,255,.55) 34deg, rgba(101,137,255,.82) 70deg, rgba(237,243,255,.95) 110deg, rgba(100,129,199,.58) 185deg, rgba(255,255,255,.0) 260deg, rgba(189,217,255,.4) 325deg, rgba(255,255,255,.0) 360deg); filter:blur(7px) saturate(110%); transform:rotateX(70deg) rotateZ(0deg); animation:spinDisk 12s linear infinite; box-shadow:0 0 70px rgba(124,154,255,.35), 0 0 160px rgba(51,73,136,.25)} .blackhole-shadow{position:absolute;inset:26%;border-radius:50%;background:radial-gradient(circle at 50% 45%, #040506 0%, #000 62%, rgba(0,0,0,.92) 70%, rgba(0,0,0,.0) 71%);box-shadow:0 0 0 1px rgba(255,255,255,.04), inset 0 0 60px rgba(0,0,0,.85), 0 0 35px rgba(0,0,0,.9)} .blackhole-ring{position:absolute;border-radius:50%;border:1px solid rgba(219,232,255,.09)} .blackhole-ring--outer{inset:8%;animation:rotateSlow 24s linear infinite} .blackhole-ring--inner{inset:18%;border-color:rgba(184,210,255,.12);animation:rotateSlowReverse 18s linear infinite} .blackhole-particles{position:absolute;inset:0} .blackhole-particles span{position:absolute;left:50%;top:50%;width:5px;height:5px;margin:-2.5px;border-radius:50%;background:rgba(235,241,255,.95);box-shadow:0 0 12px rgba(205,223,255,.8);transform-origin:0 0;animation:particleOrbit 9s linear infinite;animation-delay:calc(var(--i) * -.75s)} .blackhole-particles span::after{content:'';position:absolute;inset:0;border-radius:50%;background:rgba(255,255,255,.85);animation:particleSink 9s ease-in infinite;animation-delay:inherit} .blackhole-particles span:nth-child(3n){width:3px;height:3px;margin:-1.5px;background:rgba(188,206,255,.85)} .search-launch{height:62px;border-radius:22px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08)} .search-launch span{color:#e7ebf2} .search-launch kbd{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.08);color:#cfd6e3} .search-launch:hover{transform:translateY(-2px);background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12);box-shadow:0 22px 40px rgba(0,0,0,.22)} .section{padding-block:110px} .section-heading{display:flex;justify-content:space-between;gap:24px;align-items:flex-end;margin-bottom:34px} .section-heading h2{font-size:clamp(40px,4vw,56px);line-height:.96;letter-spacing:-.05em;margin:0} .section-heading p{max-width:520px;color:#a9b1be;font-size:16px;line-height:1.7} .category-board{display:grid;grid-template-columns:repeat(12,1fr);gap:16px} .category-tile,.category-tile--wide{grid-column:span 4;display:flex;flex-direction:column;justify-content:space-between;min-height:230px;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.08);border-radius:28px;padding:24px;transition:transform .2s ease,border-color .2s ease,background .2s ease} .category-tile--wide{grid-column:span 6} .category-tile:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.14);background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.025))} .category-tile__number,.category-tile__icon,i{color:#9ba3b0} .category-tile h3{font-size:28px;line-height:1.02;letter-spacing:-.05em;margin:16px 0 10px} .category-tile p{font-size:15px;line-height:1.6;color:#adb5c0} .catalog-section .frame{padding-top:0} .catalog-shell{gap:22px} .catalog-filters{background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.08);border-radius:26px} .filter-search,.filter-option,.view-switch,.sort-select{background:rgba(255,255,255,.03)} .filter-option{border-radius:16px} .filter-option:hover{background:rgba(255,255,255,.06)} .product-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px} .product-card{display:flex;flex-direction:column;min-height:430px;background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.07);border-radius:28px;overflow:hidden;box-shadow:none} .product-card__visual{height:210px;margin:8px;border-radius:22px;background:radial-gradient(circle at 50% 10%,color-mix(in srgb,var(--accent) 20%,transparent),transparent 36%),linear-gradient(180deg,rgba(8,10,14,.95),rgba(12,15,21,.98))} .product-card__body{display:flex;flex-direction:column;flex:1;padding:8px 18px 18px} .product-card__meta{min-height:38px} .product-card__bottom{margin-top:auto;display:flex;align-items:flex-end;justify-content:space-between;gap:12px;padding-top:16px} .product-card__price{display:flex;flex-direction:column;gap:6px;min-height:56px;justify-content:flex-end} .product-card__price strong{font-size:24px;line-height:1} .product-card__buy{height:48px;padding:0 18px;border-radius:16px;background:#f5f7fa;color:#0a0d14;border:0;font-weight:800} .product-card__buy:hover{transform:translateY(-2px)} .frame,.catalog-filters,.product-card,.category-tile,.topbar,.drawer,.product-modal__panel{transition:border-color .2s ease, background .2s ease, transform .2s ease} @keyframes spinDisk{to{transform:rotateX(70deg) rotateZ(360deg)}} @keyframes rotateSlow{to{transform:rotate(360deg)}} @keyframes rotateSlowReverse{to{transform:rotate(-360deg)}} @keyframes glowPulse{0%,100%{opacity:.72;transform:scale(1)}50%{opacity:1;transform:scale(1.03)}} @keyframes particleOrbit{0%{transform:rotate(calc(var(--i) * 30deg)) translateX(230px) scale(1)}100%{transform:rotate(calc(var(--i) * 30deg + 360deg)) translateX(40px) scale(.2)}} @keyframes particleSink{0%{opacity:0}10%{opacity:1}85%{opacity:.85}100%{opacity:0;transform:scale(.1)}} @media (max-width:1100px){ .hero{grid-template-columns:1fr;min-height:auto;padding-top:32px} .hero__copy{max-width:none;text-align:left} .hero__visual{min-height:480px} .category-tile,.category-tile--wide{grid-column:span 6} } @media (max-width:760px){ .hero h1{font-size:48px} .hero__copy p{font-size:16px} .blackhole-scene{width:min(420px,92vw)} .category-board{grid-template-columns:1fr} .category-tile,.category-tile--wide{grid-column:auto;min-height:190px} .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px} .product-card{min-height:360px} .product-card__visual{height:164px} .product-card__price strong{font-size:18px} } /* === FAZORA SATURN / LIQUID GLASS PASS === */ body{ background:#05060a; color:#f5f7fb; } .site-shell{ position:relative; isolation:isolate; overflow:hidden; background: radial-gradient(circle at 76% 15%,rgba(102,129,255,.12),transparent 26%), radial-gradient(circle at 18% 34%,rgba(132,189,255,.08),transparent 24%), linear-gradient(180deg,#05060a 0%,#070911 42%,#05060a 100%); } .liquid-backdrop{ position:absolute; inset:0; z-index:-1; overflow:hidden; pointer-events:none; } .liquid-backdrop__mesh{ position:absolute; inset:-8%; background: radial-gradient(circle at 72% 12%,rgba(118,145,255,.18),transparent 22%), radial-gradient(circle at 22% 28%,rgba(143,211,255,.12),transparent 19%), radial-gradient(circle at 48% 58%,rgba(91,104,194,.09),transparent 24%), linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px), linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px); background-size:auto,auto,auto,72px 72px,72px 72px; mask-image:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.85) 58%,transparent 100%); animation:meshDrift 22s ease-in-out infinite alternate; } .liquid-glass{ position:absolute; border:1px solid rgba(255,255,255,.12); background: linear-gradient(145deg,rgba(255,255,255,.11),rgba(255,255,255,.018) 42%,rgba(121,151,255,.045)), radial-gradient(circle at 22% 18%,rgba(255,255,255,.18),transparent 30%); box-shadow: inset 0 1px 0 rgba(255,255,255,.18), inset 0 -1px 0 rgba(255,255,255,.035), 0 40px 120px rgba(0,0,0,.26), 0 0 80px rgba(105,135,255,.08); backdrop-filter:blur(34px) saturate(145%); -webkit-backdrop-filter:blur(34px) saturate(145%); opacity:.7; will-change:transform; } .liquid-glass::after{ content:""; position:absolute; inset:1px; border-radius:inherit; background:linear-gradient(118deg,rgba(255,255,255,.11),transparent 32%,transparent 68%,rgba(157,183,255,.06)); } .liquid-glass--one{ width:520px;height:340px;right:-170px;top:80px;border-radius:46% 54% 62% 38% / 42% 43% 57% 58%; transform:rotate(-14deg); animation:liquidFloatOne 14s ease-in-out infinite; } .liquid-glass--two{ width:420px;height:520px;left:-250px;top:650px;border-radius:58% 42% 38% 62% / 52% 64% 36% 48%; transform:rotate(18deg); animation:liquidFloatTwo 18s ease-in-out infinite; } .liquid-glass--three{ width:460px;height:260px;right:5%;top:1380px;border-radius:42% 58% 49% 51% / 60% 38% 62% 40%; transform:rotate(9deg); animation:liquidFloatThree 20s ease-in-out infinite; } .liquid-glass--four{ width:340px;height:440px;left:12%;top:2350px;border-radius:64% 36% 55% 45% / 38% 59% 41% 62%; transform:rotate(-10deg); animation:liquidFloatFour 16s ease-in-out infinite; } .light-trace{ position:absolute; height:1px; background:linear-gradient(90deg,transparent,rgba(211,224,255,.7),transparent); filter:blur(.2px) drop-shadow(0 0 10px rgba(153,188,255,.7)); opacity:.28; } .light-trace--one{width:52%;right:-6%;top:530px;transform:rotate(-13deg);animation:traceMove 12s ease-in-out infinite} .light-trace--two{width:44%;left:-8%;top:1650px;transform:rotate(11deg);animation:traceMove 15s ease-in-out infinite reverse} .topbar{ margin-top:12px; border:1px solid rgba(255,255,255,.075); background:linear-gradient(135deg,rgba(15,17,26,.64),rgba(8,10,16,.36)); box-shadow:inset 0 1px 0 rgba(255,255,255,.075),0 18px 70px rgba(0,0,0,.24); backdrop-filter:blur(24px) saturate(145%); -webkit-backdrop-filter:blur(24px) saturate(145%); border-radius:22px; } .topbar.scrolled{ background:linear-gradient(135deg,rgba(14,16,24,.82),rgba(8,10,16,.68)); border-color:rgba(255,255,255,.1); } .main-nav a{position:relative;color:#dfe5ef;opacity:.78;transition:opacity .2s ease,color .2s ease} .main-nav a::after{content:"";position:absolute;left:0;right:0;bottom:-7px;height:1px;background:linear-gradient(90deg,transparent,#dbe7ff,transparent);transform:scaleX(0);transition:transform .25s ease} .main-nav a:hover::after{transform:scaleX(1)} .hero{ min-height:850px; padding-top:82px; grid-template-columns:minmax(0,1fr) minmax(480px,590px); gap:34px; } .hero__copy{position:relative;z-index:3} .hero h1{font-size:clamp(66px,7.3vw,104px);line-height:.91;letter-spacing:-.068em;max-width:760px;text-wrap:balance} .hero h1 em{ background:linear-gradient(110deg,#fff 0%,#c9ddff 36%,#9db9ff 68%,#f8fbff 100%); background-size:210% 100%; background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent; animation:headlineShimmer 8s ease-in-out infinite; } .hero__copy p{max-width:610px;color:#b6bfcd;font-size:18px} .search-launch{ position:relative; overflow:hidden; height:66px; border-radius:22px; background:linear-gradient(135deg,rgba(255,255,255,.085),rgba(255,255,255,.025)); border:1px solid rgba(255,255,255,.115); box-shadow:inset 0 1px 0 rgba(255,255,255,.11),0 22px 65px rgba(0,0,0,.25); backdrop-filter:blur(20px); } .search-launch::before{ content:""; position:absolute; inset:-80% -20%; background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.15) 50%,transparent 58%); transform:translateX(-55%) rotate(10deg); animation:searchSweep 7s ease-in-out infinite; } .search-launch>*{position:relative;z-index:1} .hero__queries--minimal button{ background:linear-gradient(135deg,rgba(255,255,255,.075),rgba(255,255,255,.018)); border-color:rgba(255,255,255,.09); box-shadow:inset 0 1px 0 rgba(255,255,255,.08); backdrop-filter:blur(14px); } .hero__visual{ min-height:650px; perspective:1100px; overflow:visible; } .saturn-scene{ position:relative; width:min(610px,92vw); aspect-ratio:1/1; display:grid; place-items:center; transform-style:preserve-3d; transition:transform .22s ease-out; will-change:transform; } .saturn-aura{ position:absolute; inset:5%; border-radius:50%; background: radial-gradient(circle,rgba(139,167,255,.19) 0%,rgba(96,124,220,.11) 30%,transparent 68%); filter:blur(28px); animation:saturnAura 7s ease-in-out infinite; } .saturn-system{ position:relative; width:100%;height:100%; display:grid;place-items:center; transform:rotate(-7deg); animation:saturnFloat 8s ease-in-out infinite; transform-style:preserve-3d; } .saturn-planet{ position:absolute; z-index:3; width:265px;height:265px; border-radius:50%; overflow:hidden; background: radial-gradient(circle at 31% 24%,rgba(255,255,255,.92) 0%,rgba(233,222,202,.9) 7%,transparent 23%), radial-gradient(circle at 38% 35%,#d9c8aa 0%,#a68e74 38%,#62536a 72%,#161a29 100%); box-shadow: inset -42px -18px 60px rgba(17,20,34,.78), inset 28px 12px 42px rgba(255,245,223,.18), 0 0 0 1px rgba(255,255,255,.14), 0 0 60px rgba(126,151,255,.25), 0 50px 100px rgba(0,0,0,.55); animation:planetBreathe 8s ease-in-out infinite; } .saturn-planet__bands{ position:absolute;inset:-8%;border-radius:50%; background: repeating-linear-gradient(0deg, rgba(255,244,216,.12) 0 8px, rgba(72,64,75,.13) 8px 15px, rgba(255,255,255,.08) 15px 21px, rgba(34,40,64,.14) 21px 29px); mix-blend-mode:overlay; transform:rotate(4deg) scale(1.05); animation:bandDrift 18s linear infinite; } .saturn-planet__shine{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 31% 28%,rgba(255,255,255,.58),transparent 34%);mix-blend-mode:screen} .saturn-planet__shade{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 72% 62%,transparent 0 30%,rgba(4,7,16,.2) 58%,rgba(3,5,12,.76) 100%)} .saturn-ring{ position:absolute; z-index:1; width:500px;height:166px; border-radius:50%; background: repeating-radial-gradient(ellipse at center, transparent 0 48%, rgba(245,235,217,.82) 49% 51%, rgba(157,171,204,.62) 52% 54%, rgba(235,221,199,.76) 55% 58%, rgba(119,139,194,.5) 59% 61%, rgba(247,240,226,.7) 62% 64%, transparent 65% 100%); filter:drop-shadow(0 0 12px rgba(197,213,255,.22)); transform:rotate(-10deg); animation:ringSpin 15s linear infinite; } .saturn-ring--back{z-index:1;clip-path:inset(0 0 50% 0);opacity:.8} .saturn-ring--front{z-index:4;clip-path:inset(50% 0 0 0);filter:drop-shadow(0 13px 18px rgba(0,0,0,.45)) drop-shadow(0 0 12px rgba(205,221,255,.24))} .saturn-orbit{position:absolute;border-radius:50%;border:1px solid rgba(206,221,255,.09);transform:rotate(-13deg)} .saturn-orbit::before{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:#e9f0ff;box-shadow:0 0 17px rgba(190,213,255,.9)} .saturn-orbit--outer{inset:4%;animation:orbitRotate 20s linear infinite} .saturn-orbit--outer::before{left:16%;top:14%} .saturn-orbit--inner{inset:17%;border-color:rgba(206,221,255,.075);animation:orbitRotateReverse 13s linear infinite} .saturn-orbit--inner::before{right:11%;bottom:22%;width:4px;height:4px} .saturn-moon{position:absolute;border-radius:50%;z-index:6;box-shadow:inset -5px -3px 8px rgba(0,0,0,.65),0 0 16px rgba(185,210,255,.28)} .saturn-moon--one{width:18px;height:18px;left:8%;top:36%;background:#a8b5d0;animation:moonOne 12s ease-in-out infinite} .saturn-moon--two{width:9px;height:9px;right:12%;bottom:26%;background:#ded7c8;animation:moonTwo 9s ease-in-out infinite} .saturn-dust{position:absolute;inset:0;z-index:0;animation:orbitRotate 26s linear infinite} .saturn-dust span{ position:absolute;left:50%;top:50%;width:3px;height:3px;border-radius:50%; background:rgba(229,237,255,.78);box-shadow:0 0 8px rgba(190,210,255,.75); transform:rotate(calc(var(--i) * 22.5deg)) translateX(calc(205px + (var(--i) % 4) * 18px)); opacity:calc(.25 + (var(--i) % 4) * .16); } .category-tile,.product-card,.catalog-filters,.brand-campaign{ position:relative; overflow:hidden; backdrop-filter:blur(20px) saturate(130%); -webkit-backdrop-filter:blur(20px) saturate(130%); } .category-tile::before,.product-card::before,.catalog-filters::before,.brand-campaign::before{ content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(360px circle at var(--mx,50%) var(--my,50%),rgba(196,216,255,.12),transparent 42%); opacity:0; transition:opacity .28s ease; } .category-tile:hover::before,.product-card:hover::before,.catalog-filters:hover::before,.brand-campaign:hover::before{opacity:1} .category-tile{ background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.022) 52%,rgba(110,139,225,.035)); box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 30px 90px rgba(0,0,0,.18); } .category-tile__icon{ display:grid;place-items:center;width:52px;height:52px;border-radius:17px; background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.035)); border:1px solid rgba(255,255,255,.1);box-shadow:inset 0 1px 0 rgba(255,255,255,.1); } .product-card{ background:linear-gradient(155deg,rgba(255,255,255,.058),rgba(255,255,255,.018) 58%,rgba(91,118,202,.03)); box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 28px 75px rgba(0,0,0,.2); transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease; } .product-card:hover{transform:translateY(-7px);border-color:rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 38px 95px rgba(0,0,0,.32)} .product-card__visual{position:relative;overflow:hidden} .product-card__visual::after{content:"";position:absolute;inset:-35%;background:linear-gradient(110deg,transparent 42%,rgba(255,255,255,.12) 50%,transparent 58%);transform:translateX(-70%);transition:transform .75s ease} .product-card:hover .product-card__visual::after{transform:translateX(70%)} .product-card__buy{box-shadow:0 12px 30px rgba(223,234,255,.12)} .catalog-filters{box-shadow:inset 0 1px 0 rgba(255,255,255,.075),0 32px 100px rgba(0,0,0,.2)} .reveal{opacity:0;transform:translateY(26px) scale(.985);filter:blur(6px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.7,.2,1),filter .75s ease} .reveal.visible{opacity:1;transform:none;filter:none} @keyframes meshDrift{0%{transform:translate3d(-1%,0,0) scale(1)}100%{transform:translate3d(2%,-1.2%,0) scale(1.025)}} @keyframes liquidFloatOne{0%,100%{transform:translate3d(0,0,0) rotate(-14deg)}50%{transform:translate3d(-52px,46px,0) rotate(-7deg)}} @keyframes liquidFloatTwo{0%,100%{transform:translate3d(0,0,0) rotate(18deg)}50%{transform:translate3d(72px,-35px,0) rotate(10deg)}} @keyframes liquidFloatThree{0%,100%{transform:translate3d(0,0,0) rotate(9deg)}50%{transform:translate3d(-44px,54px,0) rotate(15deg)}} @keyframes liquidFloatFour{0%,100%{transform:translate3d(0,0,0) rotate(-10deg)}50%{transform:translate3d(48px,-60px,0) rotate(-2deg)}} @keyframes traceMove{0%,100%{opacity:.12;transform:translateX(-5%) rotate(-13deg)}50%{opacity:.42;transform:translateX(9%) rotate(-13deg)}} @keyframes headlineShimmer{0%,100%{background-position:0 0}50%{background-position:100% 0}} @keyframes searchSweep{0%,72%{transform:translateX(-65%) rotate(10deg);opacity:0}78%{opacity:1}96%,100%{transform:translateX(65%) rotate(10deg);opacity:0}} @keyframes saturnAura{0%,100%{transform:scale(.96);opacity:.65}50%{transform:scale(1.05);opacity:1}} @keyframes saturnFloat{0%,100%{transform:translate3d(0,-5px,0) rotate(-7deg)}50%{transform:translate3d(0,13px,0) rotate(-5.8deg)}} @keyframes planetBreathe{0%,100%{box-shadow:inset -42px -18px 60px rgba(17,20,34,.78),inset 28px 12px 42px rgba(255,245,223,.18),0 0 0 1px rgba(255,255,255,.14),0 0 60px rgba(126,151,255,.25),0 50px 100px rgba(0,0,0,.55)}50%{box-shadow:inset -42px -18px 60px rgba(17,20,34,.78),inset 28px 12px 42px rgba(255,245,223,.22),0 0 0 1px rgba(255,255,255,.18),0 0 90px rgba(126,151,255,.32),0 50px 110px rgba(0,0,0,.58)}} @keyframes bandDrift{to{transform:rotate(4deg) translateY(28px) scale(1.05)}} @keyframes ringSpin{to{background-position:100px 0}} @keyframes orbitRotate{to{transform:rotate(347deg)}} @keyframes orbitRotateReverse{to{transform:rotate(-373deg)}} @keyframes moonOne{0%,100%{transform:translate(0,0) scale(.85);opacity:.55}50%{transform:translate(38px,-26px) scale(1.12);opacity:1}} @keyframes moonTwo{0%,100%{transform:translate(0,0);opacity:.45}50%{transform:translate(-32px,22px);opacity:.9}} @media(max-width:1100px){ .hero{grid-template-columns:1fr;min-height:auto;padding-top:95px} .hero__visual{min-height:560px;margin-top:-40px} .liquid-glass--one{right:-260px} } @media(max-width:760px){ .topbar{margin:8px 10px 0;border-radius:18px} .hero{padding-top:76px} .hero h1{font-size:clamp(48px,14vw,66px)} .hero__visual{min-height:420px;margin-top:-20px} .saturn-scene{width:min(470px,110vw)} .saturn-planet{width:190px;height:190px} .saturn-ring{width:365px;height:122px} .saturn-dust span{transform:rotate(calc(var(--i) * 22.5deg)) translateX(calc(148px + (var(--i) % 4) * 12px))} .liquid-glass{opacity:.5} .liquid-glass--one{width:360px;height:260px;right:-190px;top:110px} .liquid-glass--two{width:300px;height:390px;left:-230px;top:760px} } @media(prefers-reduced-motion:reduce){ .liquid-glass,.liquid-backdrop__mesh,.light-trace,.saturn-system,.saturn-aura,.saturn-orbit,.saturn-dust,.saturn-moon,.hero h1 em,.search-launch::before{animation:none!important} } .saturn-dust span{--r:225px;opacity:.58;transform:rotate(calc(var(--i) * 22.5deg)) translateX(var(--r))} .saturn-dust span:nth-child(4n+1){--r:205px;opacity:.32} .saturn-dust span:nth-child(4n+2){--r:242px;opacity:.78} .saturn-dust span:nth-child(4n+3){--r:264px;opacity:.46;width:2px;height:2px} .saturn-dust span:nth-child(4n){--r:286px;opacity:.66;width:4px;height:4px} @media(max-width:760px){ .saturn-dust span{--r:158px} .saturn-dust span:nth-child(4n+1){--r:145px} .saturn-dust span:nth-child(4n+2){--r:172px} .saturn-dust span:nth-child(4n+3){--r:190px} .saturn-dust span:nth-child(4n){--r:205px} } .site-shell::before{ content:""; position:fixed; z-index:0; left:var(--cursor-x,72vw); top:var(--cursor-y,24vh); width:460px;height:460px; border-radius:50%; transform:translate(-50%,-50%); background:radial-gradient(circle,rgba(145,177,255,.11),rgba(109,137,225,.035) 38%,transparent 70%); filter:blur(16px); pointer-events:none; transition:left .12s linear,top .12s linear; } .site-shell>header,.site-shell>main,.site-shell>footer{position:relative;z-index:1} .hero h1{font-size:clamp(62px,6vw,86px);max-width:690px} .liquid-glass--one{width:440px;height:290px;right:-155px;top:105px;opacity:.46} .liquid-glass--two{opacity:.52} @media(max-width:760px){ .site-shell::before{width:300px;height:300px;opacity:.75} .hero h1{font-size:clamp(46px,13vw,62px)} } /* === smart glass search + themed background patch === */ :root{--mx:50vw;--my:20vh} .site-shell::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;background: radial-gradient(520px 520px at var(--mx) var(--my), rgba(157,209,255,.08), transparent 60%), radial-gradient(700px 420px at 82% 14%, rgba(134,98,255,.08), transparent 58%), radial-gradient(620px 360px at 8% 78%, rgba(124,231,255,.06), transparent 62%); mix-blend-mode:screen;opacity:.9;transition:background .15s linear} .site-shell>*{position:relative;z-index:1} .theme-orbit,.theme-grid{position:absolute;pointer-events:none;opacity:.45} .theme-orbit{border:1px solid rgba(214,233,255,.08);border-radius:50%;filter:blur(.1px)} .theme-orbit--one{width:720px;height:720px;left:-220px;top:38vh;animation:themeSpin 48s linear infinite} .theme-orbit--two{width:540px;height:540px;right:-140px;top:14vh;animation:themeSpinReverse 38s linear infinite} .theme-grid{inset:0;background: linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px); background-size:120px 120px;mask-image:radial-gradient(circle at 50% 20%, black, transparent 72%);opacity:.14} @keyframes themeSpin{to{transform:rotate(360deg)}} @keyframes themeSpinReverse{to{transform:rotate(-360deg)}} .search-overlay{display:grid;place-items:start center;background:transparent;backdrop-filter:none;overflow:visible;padding-top:88px;pointer-events:none} .search-overlay.open{pointer-events:auto} .search-overlay__backdrop{position:fixed;inset:0;background:rgba(5,7,12,.38);backdrop-filter:blur(18px);opacity:0;transition:.25s} .search-overlay.open .search-overlay__backdrop{opacity:1} .search-overlay__inner{position:relative;width:min(820px,calc(100vw - 28px));margin:0 auto;padding:22px;border-radius:32px;border:1px solid rgba(255,255,255,.11);background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.06));box-shadow:0 30px 120px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.12);backdrop-filter:blur(34px) saturate(130%);transform:translateY(16px) scale(.98);opacity:0;transition:.28s cubic-bezier(.2,.8,.2,1)} .search-overlay.open .search-overlay__inner{transform:none;opacity:1} .search-overlay__inner::before{content:"";position:absolute;inset:1px;border-radius:31px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.02));pointer-events:none} .search-overlay__head,.search-suggestions,.search-empty,.search-results{position:relative;z-index:1} .overlay-close{position:absolute;right:18px;top:18px;width:42px;height:42px;border-radius:14px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.06);backdrop-filter:blur(14px);font-size:22px} .global-search{height:74px;margin-top:0;border:1px solid rgba(255,255,255,.1);border-radius:22px;padding:0 18px;background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.05));box-shadow:inset 0 1px 0 rgba(255,255,255,.12)} .global-search svg{width:24px;margin-right:14px;color:#f5f8ff} .global-search input{font-size:22px;font-weight:700;letter-spacing:-.03em} .global-search input::placeholder{color:#b7c0ce} .global-search kbd{border-color:rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:#cbd3de} .search-overlay__meta{margin:14px 2px 0;font-size:12px;color:#c3cad6} .search-suggestions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px} .search-suggestions button{height:40px;padding:0 14px;border-radius:999px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.06);color:#eef3ff;font-weight:600;transition:.18s} .search-suggestions button:hover{background:rgba(255,255,255,.1);transform:translateY(-1px)} .search-empty{padding:18px 4px 10px;color:#b4bcc8} .search-empty strong{display:block;color:#f5f8ff;font-size:16px;margin-bottom:8px} .search-empty p{margin:0;line-height:1.6;font-size:14px;max-width:620px} .search-results{display:grid;grid-template-columns:1fr;gap:10px;max-height:min(52vh,520px);overflow:auto;padding-right:4px;margin-top:8px} .search-result{min-height:84px;border-radius:22px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.045));backdrop-filter:blur(16px);padding:12px 14px;transition:.18s} .search-result:hover{transform:translateY(-2px);background:linear-gradient(180deg,rgba(255,255,255,.11),rgba(255,255,255,.055));border-color:rgba(255,255,255,.14)} .search-result__art{width:62px;height:62px;border-radius:18px;box-shadow:inset 0 1px 0 rgba(255,255,255,.07)} .search-result strong{font-size:14px} .search-result span{font-size:11px;color:#b2bac8} .search-result b{font-size:13px;color:#fff} .search-launch{position:relative;overflow:hidden;background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.045));border-color:rgba(255,255,255,.14);backdrop-filter:blur(18px) saturate(125%)} .search-launch::before{content:"";position:absolute;inset:-40% -10% auto auto;width:42%;height:180%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);transform:translateX(-180%) rotate(14deg);animation:searchSweepLite 7.5s ease-in-out infinite} .search-launch>*{position:relative;z-index:1} @keyframes searchSweepLite{0%,76%{transform:translateX(-180%) rotate(14deg);opacity:0}82%{opacity:1}100%{transform:translateX(155%) rotate(14deg);opacity:0}} @media(max-width:760px){ .search-overlay{padding-top:74px} .search-overlay__inner{width:calc(100vw - 16px);padding:18px;border-radius:26px} .global-search{height:66px;border-radius:18px;padding:0 14px} .global-search input{font-size:18px} .search-suggestions{gap:8px} .search-suggestions button{height:36px;padding:0 12px;font-size:12px} .search-empty strong{font-size:14px} .search-empty p{font-size:13px} } /* === saturn polish + richer catalog glow patch === */ .liquid-backdrop::before{ content:"";position:absolute;inset:0;pointer-events:none;opacity:.55; background: radial-gradient(2px 2px at 12% 18%, rgba(255,255,255,.65), transparent 60%), radial-gradient(1.5px 1.5px at 26% 72%, rgba(180,220,255,.55), transparent 60%), radial-gradient(2px 2px at 74% 24%, rgba(255,255,255,.55), transparent 60%), radial-gradient(1.5px 1.5px at 83% 61%, rgba(186,203,255,.45), transparent 60%), radial-gradient(2px 2px at 61% 82%, rgba(190,236,255,.5), transparent 60%), radial-gradient(1.5px 1.5px at 44% 38%, rgba(255,255,255,.35), transparent 60%); } .liquid-backdrop::after{ content:"";position:absolute;inset:-8% -10%;pointer-events:none;opacity:.42; background: radial-gradient(ellipse at 18% 24%, rgba(116,173,255,.18), transparent 34%), radial-gradient(ellipse at 82% 30%, rgba(137,110,255,.14), transparent 32%), radial-gradient(ellipse at 54% 88%, rgba(98,224,255,.12), transparent 30%); filter:blur(28px); animation:auroraShift 18s ease-in-out infinite alternate; } @keyframes auroraShift{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(1.5%, -1%, 0) scale(1.04)}} .saturn-scene{filter:drop-shadow(0 40px 120px rgba(0,0,0,.42))} .saturn-system{transform:rotate(-9deg);animation:saturnFloat 8s ease-in-out infinite} .saturn-planet{ width:272px;height:272px; background: radial-gradient(circle at 30% 24%, rgba(255,255,255,.94) 0%, rgba(247,237,218,.88) 8%, transparent 22%), radial-gradient(circle at 42% 36%, #d6bea0 0%, #b19272 34%, #7d6982 58%, #30354d 82%, #0d1220 100%); box-shadow: inset -56px -26px 72px rgba(10,14,24,.78), inset 20px 10px 28px rgba(255,245,224,.12), 0 0 0 1px rgba(255,255,255,.12), 0 0 82px rgba(120,160,255,.22), 0 56px 110px rgba(0,0,0,.58); } .saturn-planet__bands{ inset:-5%; background: radial-gradient(ellipse at 50% 22%, rgba(255,247,230,.10), transparent 28%), radial-gradient(ellipse at 44% 46%, rgba(255,231,197,.08), transparent 24%), radial-gradient(ellipse at 58% 62%, rgba(76,85,126,.10), transparent 26%), linear-gradient(180deg, rgba(255,255,255,.02), rgba(22,28,43,.05)); mix-blend-mode:soft-light; transform:rotate(3deg) scale(1.02); filter:blur(5px); animation:none; } .saturn-planet__shine{background:radial-gradient(circle at 30% 28%,rgba(255,255,255,.52),transparent 30%)} .saturn-ring{ width:530px;height:154px; transform:rotate(-12deg); background: radial-gradient(ellipse at center, transparent 0 43%, rgba(246,239,224,.88) 47%, rgba(168,184,224,.72) 50%, rgba(244,235,220,.82) 53%, transparent 60%), radial-gradient(ellipse at center, transparent 0 38%, rgba(255,255,255,.18) 46%, transparent 53%); filter:blur(.15px) drop-shadow(0 0 14px rgba(204,221,255,.22)); animation:ringDrift 24s linear infinite; } .saturn-ring::before,.saturn-ring::after{content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none} .saturn-ring::before{ background:radial-gradient(ellipse at center, transparent 0 44%, rgba(255,255,255,.10) 46%, transparent 54%); filter:blur(6px); } .saturn-ring::after{ background:radial-gradient(ellipse at center, transparent 0 50%, rgba(83,104,161,.15) 53%, transparent 58%); mix-blend-mode:screen; } .saturn-ring--back{opacity:.64;clip-path:inset(0 0 50% 0)} .saturn-ring--front{opacity:.95;clip-path:inset(50% 0 0 0);filter:drop-shadow(0 18px 24px rgba(0,0,0,.48)) drop-shadow(0 0 14px rgba(214,228,255,.22))} @keyframes ringDrift{0%{transform:rotate(-12deg) scaleX(1)}50%{transform:rotate(-10deg) scaleX(1.01)}100%{transform:rotate(-12deg) scaleX(1)}} .search-overlay__inner{padding:22px 22px 18px 22px;overflow:hidden} .overlay-close{z-index:5;top:14px;right:14px;width:40px;height:40px;line-height:1;display:grid;place-items:center;box-shadow:0 10px 24px rgba(0,0,0,.24)} .search-overlay__head{padding-right:56px} .catalog-section{position:relative} .catalog-section::before{content:"";position:absolute;inset:0;pointer-events:none;background: radial-gradient(520px 220px at 20% 16%, rgba(129,180,255,.09), transparent 65%), radial-gradient(480px 240px at 82% 34%, rgba(149,123,255,.08), transparent 68%); opacity:.9} .catalog-filters, .catalog-toolbar, .product-card{ border-color:rgba(168,188,255,.12); box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 22px 70px rgba(5,8,16,.22); } .catalog-toolbar{background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03))} .catalog-filters{background:linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025))} .filter-search,.sort-control,.view-toggle{background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02));border-color:rgba(168,188,255,.12)} .filter-search{box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 0 0 1px rgba(145,182,255,.03)} .filter-option input:checked+.filter-option__box{background:linear-gradient(135deg,#87beff,#9d7dff);box-shadow:0 0 18px rgba(142,181,255,.32)} .product-card{background:linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.022));} .product-card:hover{border-color:rgba(179,200,255,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 30px 90px rgba(4,9,20,.34),0 0 34px color-mix(in srgb,var(--accent) 10%,transparent)} .product-card__visual{background:radial-gradient(circle at 78% 18%, color-mix(in srgb,var(--accent) 28%,transparent), transparent 34%), linear-gradient(150deg, color-mix(in srgb,var(--accent) 12%,#111725), #070a10 78%)} .product-card__visual::before{box-shadow:0 0 38px color-mix(in srgb,var(--accent) 26%,transparent), inset 0 0 34px color-mix(in srgb,var(--accent) 14%,transparent)} @media(max-width:760px){ .saturn-planet{width:210px;height:210px} .saturn-ring{width:390px;height:118px} .overlay-close{top:12px;right:12px} .search-overlay__head{padding-right:48px} } /* === catalog usability upgrade === */ .catalog-shell{grid-template-columns:270px 1fr;gap:22px} .filter-shortcuts{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px} .filter-shortcuts button{ height:38px;padding:0 14px;border-radius:999px; border:1px solid rgba(255,255,255,.09); background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025)); color:#eaf0fb;font-size:12px;font-weight:700; transition:.18s ease; } .filter-shortcuts button:hover{transform:translateY(-2px);background:linear-gradient(180deg,rgba(255,255,255,.085),rgba(255,255,255,.04));border-color:rgba(180,200,255,.18)} .catalog-quickbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px;flex-wrap:wrap} .catalog-pills{display:flex;gap:10px;flex-wrap:wrap} .catalog-pill{ height:40px;padding:0 16px;border-radius:999px;border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.035);color:#d5dceb;font-size:12px;font-weight:700;transition:.18s ease; } .catalog-pill:hover{transform:translateY(-1px);background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14)} .catalog-pill.active{background:linear-gradient(135deg,rgba(149,185,255,.22),rgba(109,136,255,.14));border-color:rgba(167,196,255,.24);color:#fff;box-shadow:0 0 18px rgba(129,170,255,.16)} .catalog-summary{font-size:12px;color:#95a0b1} .product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px} .product-card__badges .badge{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .product-card__meta{line-height:1.45} .product-card__buy{min-width:104px} .product-modal__facts{grid-template-columns:repeat(3,minmax(0,1fr))} @media (min-width:1450px){.product-grid{grid-template-columns:repeat(4,minmax(0,1fr))}} @media (max-width:1100px){.catalog-shell{grid-template-columns:1fr}.catalog-quickbar{align-items:flex-start}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}} @media (max-width:760px){.catalog-pills{gap:8px}.catalog-pill{height:36px;padding:0 12px;font-size:11px}.catalog-summary{width:100%}.product-modal__facts{grid-template-columns:1fr 1fr}} /* === buyer-first navigation + premium ambient scene === */ .liquid-backdrop{position:fixed!important;inset:0!important;z-index:0!important;overflow:hidden;pointer-events:none} .site-shell{isolation:isolate;background: radial-gradient(1000px 680px at 74% 2%,rgba(79,112,191,.14),transparent 65%), radial-gradient(760px 520px at 4% 46%,rgba(83,151,190,.08),transparent 70%), linear-gradient(180deg,#05070b 0%,#070a10 42%,#05070b 100%)} .site-shell>*:not(.liquid-backdrop){position:relative;z-index:1} .ambient-canvas{position:fixed;inset:0;width:100%;height:100%;opacity:.82} .cursor-aura{position:fixed;left:0;top:0;width:420px;height:420px;margin:0;border-radius:50%;opacity:.48;will-change:transform;background:radial-gradient(circle,rgba(142,190,255,.15) 0%,rgba(105,145,230,.07) 32%,transparent 70%);filter:blur(10px);mix-blend-mode:screen} .cursor-orbit{position:fixed;left:0;top:0;width:138px;height:138px;border-radius:50%;border:1px solid rgba(206,225,255,.065);will-change:transform;opacity:.55} .cursor-orbit::before,.cursor-orbit::after{content:"";position:absolute;border-radius:50%;background:rgba(221,235,255,.7);box-shadow:0 0 12px rgba(156,197,255,.72)} .cursor-orbit::before{width:4px;height:4px;left:18px;top:20px}.cursor-orbit::after{width:2px;height:2px;right:16px;bottom:27px} .liquid-backdrop__mesh{opacity:.28!important;filter:saturate(.8)} .liquid-glass{opacity:.42!important;filter:blur(2px) saturate(105%)} .theme-grid{opacity:.08!important;background-size:150px 150px!important} .main-nav{align-items:center;gap:22px;margin-left:48px} .main-nav a,.main-nav__support{font-size:13px;font-weight:650;color:#b8c0cc;transition:color .2s ease,background .2s ease,border-color .2s ease} .main-nav a:hover{color:#fff} .main-nav__support{height:38px;padding:0 14px;border-radius:13px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.035)} .main-nav__support:hover{color:#fff;border-color:rgba(181,207,255,.16);background:rgba(255,255,255,.06)} .hero{position:relative;display:block!important;min-height:880px;padding-top:170px;padding-bottom:92px;overflow:hidden} .hero::before{content:"";position:absolute;inset:80px 0 0;border-radius:44px;background: linear-gradient(135deg,rgba(255,255,255,.035),rgba(255,255,255,.008) 46%,rgba(121,163,234,.025)); border:1px solid rgba(255,255,255,.055);box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 50px 140px rgba(0,0,0,.22);pointer-events:none} .hero__content{position:relative;z-index:3;max-width:850px;padding:68px 0 36px 54px} .hero__eyebrow{display:flex;align-items:center;gap:12px;margin-bottom:24px;color:#a9b5c5;font-size:11px;font-weight:750;letter-spacing:.17em} .hero__eyebrow span{width:34px;height:1px;background:linear-gradient(90deg,#dfeaff,rgba(151,185,255,.3))} .hero h1{max-width:850px;margin:0 0 26px;font-size:clamp(64px,7.1vw,106px);line-height:.9;letter-spacing:-.072em;font-weight:700} .hero h1 em{font-style:normal;background:linear-gradient(105deg,#ffffff 0%,#d7e8ff 38%,#91b8f7 74%,#dbe8ff 100%);background-size:180% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;animation:heroTextFlow 9s ease-in-out infinite} .hero__content>p{max-width:690px;margin:0 0 32px;color:#acb5c2;font-size:18px;line-height:1.72} .search-launch{width:min(720px,100%);height:70px;border-radius:23px;background:linear-gradient(180deg,rgba(255,255,255,.105),rgba(255,255,255,.045));border:1px solid rgba(190,211,255,.13);box-shadow:inset 0 1px 0 rgba(255,255,255,.13),0 24px 80px rgba(2,7,16,.28);backdrop-filter:blur(26px) saturate(130%)} .search-launch:hover{border-color:rgba(191,215,255,.24);box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 28px 100px rgba(11,31,67,.35),0 0 32px rgba(115,163,232,.1)} .search-launch span{color:#eef4fc;font-weight:650} .hero-categories{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;width:min(820px,100%);margin-top:20px} .hero-categories button{position:relative;min-height:82px;padding:16px 18px;text-align:left;border-radius:20px;border:1px solid rgba(255,255,255,.075);background:linear-gradient(160deg,rgba(255,255,255,.065),rgba(255,255,255,.022));backdrop-filter:blur(20px);overflow:hidden;transition:transform .22s ease,border-color .22s ease,background .22s ease,box-shadow .22s ease} .hero-categories button::after{content:"";position:absolute;inset:-80% -30%;background:linear-gradient(100deg,transparent 42%,rgba(255,255,255,.13),transparent 58%);transform:translateX(-70%);transition:transform .65s ease} .hero-categories button:hover{transform:translateY(-3px);border-color:rgba(184,211,255,.15);background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.03));box-shadow:0 18px 42px rgba(0,0,0,.2)} .hero-categories button:hover::after{transform:translateX(70%)} .hero-categories b,.hero-categories span{position:relative;z-index:1;display:block}.hero-categories b{font-size:14px}.hero-categories span{margin-top:6px;color:#8e99a9;font-size:11px} .hero__trust{display:flex;gap:22px;flex-wrap:wrap;margin-top:24px;color:#9da8b7;font-size:11px} .hero__trust span{display:flex;align-items:center;gap:8px}.hero__trust i{width:6px;height:6px;border-radius:50%;background:#cfe1ff;box-shadow:0 0 13px rgba(156,196,255,.75)} .hero__atmosphere{--hx:0px;--hy:0px;--hr:0deg;position:absolute;z-index:1;inset:80px 0 0;pointer-events:none;transform:translate3d(var(--hx),var(--hy),0) rotate(var(--hr));transition:transform .32s ease-out;overflow:hidden;border-radius:44px} .hero__atmosphere::before{content:"";position:absolute;width:760px;height:760px;right:-150px;top:-160px;border-radius:50%;background:radial-gradient(circle,rgba(122,159,222,.14),rgba(76,104,168,.06) 38%,transparent 70%);filter:blur(16px);animation:atmospherePulse 8s ease-in-out infinite} .ghost-saturn{position:absolute;right:-110px;top:70px;width:670px;height:520px;opacity:.28;filter:blur(.1px) saturate(.72);transform:rotate(-11deg);animation:ghostSaturnFloat 13s ease-in-out infinite} .ghost-saturn__planet{position:absolute;left:205px;top:125px;width:265px;height:265px;border-radius:50%;background:radial-gradient(circle at 31% 28%,rgba(240,247,255,.66),transparent 22%),radial-gradient(circle at 43% 42%,rgba(135,160,203,.55),rgba(48,65,99,.62) 54%,rgba(8,13,24,.9) 100%);box-shadow:inset -54px -28px 68px rgba(3,8,18,.82),0 0 90px rgba(104,154,229,.2)} .ghost-saturn__ring{position:absolute;left:72px;top:190px;width:530px;height:142px;border-radius:50%;background:radial-gradient(ellipse at center,transparent 0 44%,rgba(206,224,249,.36) 47%,rgba(121,155,207,.22) 51%,rgba(225,236,251,.25) 54%,transparent 60%)} .ghost-saturn__ring--back{z-index:-1;clip-path:inset(0 0 50% 0)}.ghost-saturn__ring--front{z-index:2;clip-path:inset(50% 0 0 0);filter:drop-shadow(0 10px 16px rgba(0,0,0,.28))} .hero-orbit{position:absolute;border-radius:50%;border:1px solid rgba(198,220,255,.055)} .hero-orbit::before{content:"";position:absolute;width:5px;height:5px;border-radius:50%;background:rgba(222,235,255,.75);box-shadow:0 0 14px rgba(150,194,255,.8)} .hero-orbit--one{width:780px;height:780px;right:-240px;top:-200px;animation:heroOrbit 38s linear infinite}.hero-orbit--one::before{left:20%;top:14%} .hero-orbit--two{width:480px;height:480px;right:40px;bottom:-280px;animation:heroOrbitReverse 29s linear infinite}.hero-orbit--two::before{right:12%;top:30%;width:3px;height:3px} .hero-glass{position:absolute;border:1px solid rgba(255,255,255,.05);background:linear-gradient(135deg,rgba(255,255,255,.055),rgba(255,255,255,.008));backdrop-filter:blur(30px);box-shadow:inset 0 1px 0 rgba(255,255,255,.055);animation:heroGlassFloat 12s ease-in-out infinite} .hero-glass--one{width:330px;height:190px;right:9%;top:11%;border-radius:42% 58% 67% 33%/47% 35% 65% 53%;transform:rotate(13deg)} .hero-glass--two{width:260px;height:230px;right:25%;bottom:3%;border-radius:58% 42% 38% 62%/39% 62% 38% 61%;animation-delay:-6s} .purchase-flow{position:relative;display:grid;grid-template-columns:260px 1fr;gap:34px;align-items:center;margin-top:28px;margin-bottom:105px;padding:24px;border-radius:28px;border:1px solid rgba(255,255,255,.07);background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.018));box-shadow:inset 0 1px 0 rgba(255,255,255,.065);backdrop-filter:blur(22px)} .purchase-flow__intro{padding:8px 16px}.purchase-flow__intro span{display:block;color:#8390a1;font-size:10px;letter-spacing:.16em;text-transform:uppercase}.purchase-flow__intro strong{display:block;margin-top:8px;font-size:20px} .purchase-flow__steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.purchase-flow article{display:flex;gap:13px;align-items:center;min-height:76px;padding:13px 14px;border-radius:19px;border:1px solid rgba(255,255,255,.055);background:rgba(255,255,255,.025)} .purchase-flow article>b{display:grid;place-items:center;width:38px;height:38px;border-radius:13px;background:rgba(199,221,255,.09);color:#dceaff;font-size:10px}.purchase-flow article div{display:flex;flex-direction:column;gap:5px}.purchase-flow article strong{font-size:12px}.purchase-flow article span{color:#7f8998;font-size:10px} .catalog-section{padding-top:92px} .support-cta{display:flex;align-items:center;justify-content:space-between;gap:34px;margin-top:110px;margin-bottom:110px;padding:46px 52px;border-radius:34px;border:1px solid rgba(255,255,255,.08);background:radial-gradient(circle at 86% 22%,rgba(120,170,245,.13),transparent 30%),linear-gradient(145deg,rgba(255,255,255,.06),rgba(255,255,255,.018));box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 36px 100px rgba(0,0,0,.22);backdrop-filter:blur(28px)} .support-cta>div>span{color:#8e9aac;font-size:10px;letter-spacing:.16em}.support-cta h2{margin:10px 0 12px;font-size:36px;letter-spacing:-.04em}.support-cta p{margin:0;color:#929dac;line-height:1.65}.support-cta button{height:56px;padding:0 22px;border:0;border-radius:17px;background:#f4f7fb;color:#080b11;font-weight:800;white-space:nowrap}.support-cta button span{margin-left:14px} @keyframes heroTextFlow{0%,100%{background-position:0 50%}50%{background-position:100% 50%}} @keyframes atmospherePulse{0%,100%{opacity:.68;transform:scale(1)}50%{opacity:1;transform:scale(1.04)}} @keyframes ghostSaturnFloat{0%,100%{transform:rotate(-11deg) translate3d(0,0,0)}50%{transform:rotate(-9deg) translate3d(-10px,12px,0)}} @keyframes heroOrbit{to{transform:rotate(360deg)}}@keyframes heroOrbitReverse{to{transform:rotate(-360deg)}} @keyframes heroGlassFloat{0%,100%{translate:0 0;rotate:0deg}50%{translate:-12px 16px;rotate:3deg}} @media(max-width:1180px){ .main-nav{gap:14px;margin-left:30px}.main-nav a,.main-nav__support{font-size:11px} .hero__content{max-width:720px}.ghost-saturn{right:-230px;opacity:.23} .purchase-flow{grid-template-columns:1fr}.purchase-flow__intro{padding-bottom:0} } @media(max-width:1020px){ .hero{padding-top:130px;min-height:auto}.hero::before,.hero__atmosphere{inset:70px 0 0}.hero__content{padding:62px 38px 50px;max-width:760px} .ghost-saturn{right:-310px;top:130px;opacity:.17}.hero-categories{grid-template-columns:repeat(2,minmax(0,1fr))} .purchase-flow__steps{grid-template-columns:1fr}.support-cta{align-items:flex-start;flex-direction:column} } @media(max-width:760px){ .cursor-aura,.cursor-orbit{display:none}.hero{padding-top:92px;padding-bottom:45px}.hero::before,.hero__atmosphere{inset:52px 0 0;border-radius:30px}.hero__content{padding:52px 18px 36px}.hero__eyebrow{font-size:9px;letter-spacing:.12em}.hero h1{font-size:49px;line-height:.94}.hero__content>p{font-size:15px;line-height:1.65}.hero-categories{grid-template-columns:1fr 1fr;gap:8px}.hero-categories button{min-height:72px;padding:13px;border-radius:17px}.hero__trust{gap:12px}.hero__trust span{font-size:9px}.ghost-saturn{width:500px;height:390px;right:-300px;top:140px;opacity:.12}.ghost-saturn__planet{left:155px;top:95px;width:200px;height:200px}.ghost-saturn__ring{left:54px;top:144px;width:400px;height:108px}.purchase-flow{margin-top:12px;margin-bottom:70px;padding:16px;border-radius:23px}.purchase-flow__steps{gap:8px}.support-cta{margin-block:75px;padding:30px 24px;border-radius:26px}.support-cta h2{font-size:29px}.support-cta button{width:100%} } @media(prefers-reduced-motion:reduce){.ambient-canvas,.cursor-aura,.cursor-orbit{display:none!important}.ghost-saturn,.hero-orbit,.hero-glass,.hero__atmosphere,.hero h1 em{animation:none!important}} /* === v3.5 catalog navigation refinement === */ .catalog-shell--advanced{display:block!important} .catalog-top{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(430px,.65fr);gap:16px;align-items:stretch;margin-bottom:18px} .catalog-search-main{min-height:76px;padding:0 20px;border:1px solid rgba(177,202,255,.13);border-radius:25px;background:linear-gradient(160deg,rgba(255,255,255,.075),rgba(255,255,255,.028));box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 22px 70px rgba(2,7,16,.2);backdrop-filter:blur(24px);display:grid;grid-template-columns:26px minmax(0,1fr) auto;align-items:center;gap:14px;transition:.2s} .catalog-search-main:focus-within{border-color:rgba(167,203,255,.28);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 26px 80px rgba(4,17,40,.28),0 0 0 4px rgba(124,175,255,.045)} .catalog-search-main svg{width:24px;color:#eef5ff}.catalog-search-main input{min-width:0;border:0;outline:0;background:transparent;color:#fff;font:inherit;font-size:17px;font-weight:700}.catalog-search-main input::placeholder{color:#9ca8b8}.catalog-search-main>span{color:#748194;font-size:10px;white-space:nowrap} .catalog-toolbar--compact{min-height:76px;margin:0;padding:12px 14px 12px 18px;border-radius:25px} .catalog-category-block{margin-bottom:22px;padding:22px;border:1px solid rgba(255,255,255,.08);border-radius:30px;background:linear-gradient(155deg,rgba(255,255,255,.055),rgba(255,255,255,.018));box-shadow:inset 0 1px 0 rgba(255,255,255,.065);backdrop-filter:blur(22px)} .catalog-category-block__head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:16px}.catalog-category-block__head strong{font-size:18px;letter-spacing:-.025em}.catalog-category-block__head button{height:38px;padding:0 14px;border:1px solid rgba(255,255,255,.08);border-radius:13px;background:rgba(255,255,255,.035);color:#aeb8c7;font-size:10px;font-weight:750}.catalog-category-block__head button:hover{background:rgba(255,255,255,.06);color:#fff} .catalog-pills--large{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px} .catalog-pills--large .catalog-pill{height:66px;padding:0 18px;border-radius:21px;text-align:left;font-size:14px;letter-spacing:-.015em;background:linear-gradient(155deg,rgba(255,255,255,.06),rgba(255,255,255,.02));position:relative;overflow:hidden} .catalog-pills--large .catalog-pill::after{content:"↗";position:absolute;right:17px;top:50%;transform:translateY(-50%);color:#697587;font-size:13px;transition:.2s} .catalog-pills--large .catalog-pill:hover::after,.catalog-pills--large .catalog-pill.active::after{color:#fff;transform:translate(2px,-50%)} .catalog-pills--large .catalog-pill.active{background:radial-gradient(circle at 86% 20%,rgba(164,202,255,.18),transparent 35%),linear-gradient(145deg,rgba(142,184,255,.18),rgba(97,119,180,.08));border-color:rgba(181,209,255,.23);box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 16px 38px rgba(10,28,58,.18)} .catalog-category-block .catalog-summary{margin-top:14px;padding-top:14px;border-top:1px solid rgba(255,255,255,.06)} .profile-button.is-authenticated .profile-button__dot{background:#8be2b6;box-shadow:0 0 13px rgba(105,226,170,.65)} @media(max-width:1120px){.catalog-top{grid-template-columns:1fr}.catalog-pills--large{grid-template-columns:repeat(3,minmax(0,1fr))}} @media(max-width:760px){.catalog-search-main{min-height:66px;padding:0 14px;grid-template-columns:22px 1fr}.catalog-search-main>span{display:none}.catalog-search-main input{font-size:14px}.catalog-toolbar--compact{min-height:64px}.catalog-pills--large{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.catalog-pills--large .catalog-pill{height:58px;padding:0 13px;border-radius:17px;font-size:12px}.catalog-pills--large .catalog-pill::after{right:12px}.catalog-category-block{padding:16px;border-radius:24px}.catalog-category-block__head strong{font-size:16px}} .catalog-pills--large .catalog-pill{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:6px} .catalog-pills--large .catalog-pill span{font-size:15px;font-weight:800;color:#eef4fc} .catalog-pills--large .catalog-pill small{font-size:9px;color:#7f8b9d;font-weight:650} .catalog-pills--large .catalog-pill.active small{color:#adc9ee} @media(max-width:760px){.catalog-pills--large .catalog-pill span{font-size:12px}.catalog-pills--large .catalog-pill small{font-size:8px}} .support-cta__link{height:56px;padding:0 22px;border:0;border-radius:17px;background:#f4f7fb;color:#080b11;font-weight:800;white-space:nowrap;display:flex;align-items:center}.support-cta__link span{margin-left:14px}.support-cta__link:hover{transform:translateY(-2px)} .main-nav__support{display:flex;align-items:center;justify-content:center} /* === FAZORA premium black / cold-blue system v3.6 === */ :root{ --bg:#010306; --bg-soft:#030812; --panel:#07101d; --panel-2:#0a1424; --line:rgba(144,190,255,.105); --line-strong:rgba(132,190,255,.28); --text:#ffffff; --muted:#9aa9bc; --dim:#607086; --blue:#388bff; --violet:#388bff; --cyan:#9ed8ff; --gradient:linear-gradient(112deg,#ffffff 0%,#d8edff 44%,#8fc8ff 100%); } html{background:#010306} body{background:#010306;color:#fff} .site-shell{ background: radial-gradient(900px 560px at 82% 8%,rgba(25,105,220,.14),transparent 66%), radial-gradient(720px 500px at 10% 37%,rgba(0,83,184,.09),transparent 70%), linear-gradient(180deg,#010306 0%,#02050a 45%,#010306 100%); } .site-shell::before{ background: radial-gradient(480px 480px at var(--mx) var(--my),rgba(73,151,255,.085),transparent 64%), radial-gradient(800px 460px at 90% 14%,rgba(19,100,214,.08),transparent 64%)!important; mix-blend-mode:screen; } .liquid-glass{opacity:.16!important;filter:blur(8px) saturate(90%)} .liquid-backdrop__mesh{opacity:.13!important} .light-trace{opacity:.22!important} .theme-grid{opacity:.075!important;background-size:150px 150px} .theme-orbit{border-color:rgba(117,177,255,.055);opacity:.45} .cursor-aura{opacity:.38;background:radial-gradient(circle,rgba(82,159,255,.15) 0%,rgba(21,99,206,.055) 38%,transparent 72%)} .cursor-orbit{border-color:rgba(130,190,255,.13)} .topbar{ height:82px; background:linear-gradient(180deg,rgba(1,3,6,.94),rgba(1,3,6,.7),transparent); backdrop-filter:blur(10px); } .topbar.scrolled{ height:70px; background:rgba(2,6,12,.88); border-bottom-color:rgba(126,181,255,.1); backdrop-filter:blur(24px) saturate(125%); } .brand__portal{background:linear-gradient(130deg,#fff,#8cc7ff);background-clip:text;text-shadow:0 0 20px rgba(79,151,255,.34)} .main-nav a{color:#9daabd;font-weight:650} .main-nav a:hover{color:#fff} .topbar__language,.icon-button,.profile-button,.menu-button{ background:rgba(4,10,18,.72); border-color:rgba(137,188,255,.11); box-shadow:none; } .topbar__language:hover,.icon-button:hover,.profile-button:hover{background:rgba(10,28,52,.78);border-color:rgba(126,187,255,.22)} .cart-button{background:#f7fbff;color:#020712;box-shadow:0 12px 36px rgba(49,133,243,.12)} .cart-button b{background:#081427} .hero{min-height:830px;padding-top:148px;padding-bottom:105px} .hero::before{ border:0!important; background: radial-gradient(600px 460px at 84% 35%,rgba(43,122,231,.12),transparent 68%), linear-gradient(180deg,rgba(3,9,17,.18),transparent 76%)!important; box-shadow:none!important; backdrop-filter:none!important; } .hero__content{padding-left:30px;max-width:900px} .hero__eyebrow{color:#7faedf;letter-spacing:.2em} .hero__eyebrow span{background:linear-gradient(90deg,#a7d4ff,#277ee8)} .hero h1{color:#fff;max-width:900px;font-size:clamp(62px,6.6vw,100px)} .hero h1 em{background:linear-gradient(105deg,#fff 0%,#d7edff 42%,#6db6ff 100%);background-clip:text} .hero__content>p{color:#9eacbd;max-width:650px} .ghost-saturn{opacity:.075;filter:saturate(.55) hue-rotate(8deg);right:-170px} .ghost-saturn__planet{background:radial-gradient(circle at 30% 26%,rgba(220,240,255,.38),transparent 22%),radial-gradient(circle at 45% 45%,rgba(57,119,201,.32),rgba(8,31,64,.42) 60%,rgba(1,7,17,.8) 100%);box-shadow:inset -54px -28px 68px rgba(0,5,15,.88),0 0 110px rgba(48,132,255,.13)} .ghost-saturn__ring{background:radial-gradient(ellipse at center,transparent 0 44%,rgba(126,188,255,.18) 48%,rgba(37,111,211,.12) 52%,transparent 60%)} .hero-orbit{border-color:rgba(109,172,255,.07)} .hero-glass{opacity:.12;filter:blur(18px)} .search-launch{ background:rgba(5,14,27,.72)!important; border-color:rgba(131,188,255,.18)!important; box-shadow:0 26px 80px rgba(0,24,65,.3),inset 0 1px 0 rgba(255,255,255,.07)!important; backdrop-filter:blur(24px) saturate(115%); } .search-launch:hover{background:rgba(8,24,48,.84)!important;border-color:rgba(124,190,255,.35)!important;box-shadow:0 30px 95px rgba(0,52,125,.3),0 0 0 4px rgba(67,147,255,.045)!important} .search-launch span{color:#eaf5ff} .search-launch kbd{background:#06101e;border-color:rgba(135,190,255,.13);color:#8fa6be} .hero-categories{gap:12px;margin-top:24px} .hero-categories button{ min-height:88px; border:0; border-top:1px solid rgba(126,187,255,.2); border-radius:20px; background:linear-gradient(180deg,#07111f,#040a13); backdrop-filter:none; box-shadow:0 16px 46px rgba(0,0,0,.22); } .hero-categories button:hover{background:linear-gradient(180deg,#0b203b,#061121);border-color:#5aa8ff;box-shadow:0 22px 60px rgba(0,47,108,.32)} .hero-categories b{font-size:15px;color:#fff} .hero-categories span{color:#7990aa} .hero__trust{color:#8393a7} .hero__trust i{background:#77baff;box-shadow:0 0 15px rgba(70,155,255,.75)} .purchase-flow{ padding:6px 0 38px; border:0; border-radius:0; background:transparent; box-shadow:none; backdrop-filter:none; } .purchase-flow__intro{padding-left:0} .purchase-flow__intro span{color:#548ac6} .purchase-flow__steps{gap:14px} .purchase-flow article{ min-height:94px; border:0; border-top:1px solid rgba(120,181,255,.14); border-radius:0; background:transparent; padding:19px 4px; } .purchase-flow article>b{background:#07192f;color:#93c8ff;border:1px solid rgba(110,178,255,.12)} .purchase-flow article span{color:#718298} .catalog-section{ background: radial-gradient(720px 330px at 72% 10%,rgba(27,106,220,.10),transparent 72%), linear-gradient(180deg,transparent,#020813 12%,#020813 88%,transparent); padding-top:105px; } .section-heading h2{color:#fff} .section-heading h2 em{background:linear-gradient(105deg,#fff,#84c2ff);background-clip:text} .section-heading p{color:#8292a7} .catalog-top{gap:16px} .catalog-search-main,.catalog-toolbar--compact{ background:rgba(5,15,29,.82); border-color:rgba(122,185,255,.16); backdrop-filter:blur(24px) saturate(115%); box-shadow:0 26px 70px rgba(0,22,58,.28),inset 0 1px 0 rgba(255,255,255,.055); } .catalog-search-main:focus-within{border-color:rgba(103,178,255,.42);box-shadow:0 26px 80px rgba(0,45,105,.32),0 0 0 4px rgba(77,157,255,.055)} .catalog-category-block{ padding:28px; border:0; border-radius:34px; background:#030914; box-shadow:0 30px 90px rgba(0,0,0,.25); backdrop-filter:none; } .catalog-category-block__head{margin-bottom:22px} .catalog-category-block__head strong{font-size:22px;color:#fff} .catalog-category-block__head button{background:#071426;border-color:rgba(111,179,255,.12);color:#9db1c8} .catalog-pills--large{gap:12px} .catalog-pills--large .catalog-pill{ height:78px; padding:0 21px; border:1px solid rgba(112,178,255,.09); border-radius:23px; background:linear-gradient(180deg,#07111f,#040a13); box-shadow:none; } .catalog-pills--large .catalog-pill:hover{background:linear-gradient(180deg,#0a1c33,#06101d);border-color:rgba(105,176,255,.24);transform:translateY(-2px)} .catalog-pills--large .catalog-pill.active{background:linear-gradient(145deg,#0b2c57,#071a34);border-color:#438fe8;box-shadow:0 18px 50px rgba(0,66,146,.28)} .catalog-pills--large .catalog-pill span{color:#fff;font-size:16px} .catalog-pills--large .catalog-pill small{color:#71869d} .catalog-pills--large .catalog-pill.active small{color:#a7d2ff} .catalog-category-block .catalog-summary{color:#6f8298;border-top-color:rgba(110,178,255,.08)} .catalog-toolbar{background:#040b15;border-color:rgba(117,177,255,.1)} .sort-control,.view-toggle{background:#06101d;border-color:rgba(115,180,255,.11)} .support-cta{ border:0; background:linear-gradient(135deg,#061326,#020810); box-shadow:0 34px 100px rgba(0,18,48,.34); backdrop-filter:none; } .support-cta>div>span{color:#5e9ce0} .support-cta p{color:#8495aa} .support-cta__link{background:#f7fbff;color:#020711;box-shadow:0 12px 38px rgba(52,135,240,.13)} .footer{background:#010306;border-top-color:rgba(113,175,255,.07)} .footer a,.footer button,.footer p{color:#718196} .search-overlay__backdrop{background:rgba(0,3,8,.66)} .search-overlay__inner{ background:rgba(4,13,26,.9); border-color:rgba(128,189,255,.18); box-shadow:0 34px 120px rgba(0,16,42,.55),inset 0 1px 0 rgba(255,255,255,.07); } .global-search,.search-result{background:rgba(7,22,43,.72);border-color:rgba(125,187,255,.13)} .search-suggestions button{background:#071426;border-color:rgba(115,180,255,.11)} .drawer__panel,.product-modal__card{background:#030914;border-color:rgba(119,181,255,.13)} @media(max-width:760px){ .hero__content{padding-inline:14px} .hero h1{font-size:50px} .hero-categories button{border-radius:18px} .catalog-category-block{padding:17px;border-radius:25px} .catalog-pills--large .catalog-pill{height:66px;border-radius:18px} .purchase-flow{padding-inline:4px} } /* === FAZORA catalogue hierarchy v3.7 === */ [hidden]{display:none!important} .catalog-section .frame{position:relative} .catalog-shell--advanced{display:block!important} .catalog-category-block, .catalog-subcategory-block, #catalogProductStage{ animation:catalogStageIn .38s cubic-bezier(.2,.8,.2,1) both; } @keyframes catalogStageIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}} .catalog-category-block{ padding:34px; border-radius:36px; background: radial-gradient(560px 280px at 90% 0%,rgba(41,124,238,.09),transparent 70%), #02070e; box-shadow:0 34px 100px rgba(0,0,0,.34); } .catalog-category-block__head strong{font-size:25px;letter-spacing:-.04em} .catalog-category-block__head button{height:42px;border-radius:14px;padding-inline:16px} .catalog-pills--large{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px} .catalog-pills--large .catalog-pill{ min-height:132px;height:auto; padding:22px 24px; display:grid; grid-template-columns:52px 1fr auto; grid-template-rows:auto auto; column-gap:17px; row-gap:7px; align-items:center; border-radius:27px; border:1px solid rgba(116,181,255,.10); background:linear-gradient(155deg,#07111f 0%,#030811 100%); overflow:hidden; text-align:left; isolation:isolate; } .catalog-pills--large .catalog-pill::before{ content:""; position:absolute; width:190px;height:190px;border-radius:50%; right:-95px;top:-105px; background:radial-gradient(circle,color-mix(in srgb,var(--category-accent) 28%,transparent),transparent 67%); opacity:.55;transition:.28s;z-index:-1; } .catalog-pills--large .catalog-pill::after{content:"→";right:23px;bottom:21px;top:auto;transform:none;color:#5f7288;font-size:17px} .catalog-pills--large .catalog-pill:hover::after,.catalog-pills--large .catalog-pill.active::after{transform:translateX(3px);color:#fff} .catalog-pills--large .catalog-pill:hover{ background:linear-gradient(155deg,#0a1b31,#040a13); border-color:color-mix(in srgb,var(--category-accent) 38%,rgba(255,255,255,.1)); transform:translateY(-4px); box-shadow:0 24px 64px rgba(0,32,79,.25); } .catalog-pills--large .catalog-pill:hover::before{opacity:.9;transform:scale(1.08)} .catalog-pills--large .catalog-pill.active{background:linear-gradient(155deg,#0b2443,#061222);border-color:color-mix(in srgb,var(--category-accent) 58%,#1b4d86)} .catalog-pills--large .catalog-pill i{ grid-row:1/3; width:52px;height:52px;border-radius:17px; display:grid;place-items:center; background:color-mix(in srgb,var(--category-accent) 14%,#07101d); border:1px solid color-mix(in srgb,var(--category-accent) 30%,transparent); color:#fff;font-size:20px;font-weight:850;font-style:normal; box-shadow:0 0 28px color-mix(in srgb,var(--category-accent) 12%,transparent); } .catalog-pills--large .catalog-pill span{grid-column:2;font-size:18px;align-self:end} .catalog-pills--large .catalog-pill small{grid-column:2;font-size:11px;align-self:start;color:#71849a} .catalog-pills--large .catalog-pill b{ grid-column:3;grid-row:1; min-width:34px;height:28px;padding-inline:9px;border-radius:999px; display:grid;place-items:center; background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06); color:#8ca0b7;font-size:10px;font-weight:750; } .catalog-category-block .catalog-summary{margin-top:22px;padding-top:19px} .catalog-subcategory-block{ padding:30px; border-radius:36px; background: radial-gradient(700px 330px at 84% 0%,rgba(33,116,237,.08),transparent 70%), #02070e; box-shadow:0 34px 100px rgba(0,0,0,.34); } .catalog-stage-head{ display:grid; grid-template-columns:170px 1fr auto; align-items:center; gap:24px; margin-bottom:24px; } .catalog-stage-head>div span{display:block;color:#5f94cf;font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;margin-bottom:7px} .catalog-stage-head h3{margin:0;font-size:30px;letter-spacing:-.045em;line-height:1.05;color:#fff} .catalog-stage-head>small{color:#70839a;font-size:11px} .catalog-back{ height:45px;padding:0 15px;border-radius:15px; border:1px solid rgba(115,181,255,.11); background:#06101d;color:#9eb0c4;font-size:11px;font-weight:750; transition:.2s; } .catalog-back span{margin-right:9px;color:#d8ebff} .catalog-back:hover{background:#0a1b30;border-color:rgba(111,181,255,.24);color:#fff;transform:translateX(-2px)} .subcategory-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px} .subcategory-card{ min-height:330px; padding:0; border-radius:30px; border:1px solid rgba(119,181,255,.1); background:linear-gradient(170deg,#07111f 0%,#030811 76%); color:#fff;text-align:left;overflow:hidden;position:relative;isolation:isolate; display:flex;flex-direction:column; transition:transform .28s cubic-bezier(.2,.8,.2,1),border-color .28s,box-shadow .28s; } .subcategory-card::before{ content:"";position:absolute;inset:0;pointer-events:none;z-index:5; background:radial-gradient(240px circle at var(--card-x,50%) var(--card-y,30%),color-mix(in srgb,var(--accent) 12%,transparent),transparent 72%); opacity:0;transition:.25s; } .subcategory-card:hover{transform:translateY(-7px);border-color:color-mix(in srgb,var(--accent) 38%,rgba(255,255,255,.12));box-shadow:0 34px 86px rgba(0,0,0,.38),0 0 38px color-mix(in srgb,var(--accent) 10%,transparent)} .subcategory-card:hover::before{opacity:1} .subcategory-card__visual{ height:150px;position:relative;display:grid;place-items:center;overflow:hidden; background: radial-gradient(circle at 50% 42%,color-mix(in srgb,var(--accent) 18%,transparent),transparent 46%), linear-gradient(180deg,color-mix(in srgb,var(--accent) 5%,#081321),#050b14); } .subcategory-card__visual::after{content:"";position:absolute;inset:auto 12% 0;height:1px;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--accent) 42%,transparent),transparent)} .subcategory-card__symbol{ position:relative;z-index:3;width:72px;height:72px;border-radius:24px; display:grid;place-items:center; background:rgba(2,8,16,.62);border:1px solid color-mix(in srgb,var(--accent) 35%,rgba(255,255,255,.08)); color:#fff;font-size:26px;font-weight:850; box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 0 44px color-mix(in srgb,var(--accent) 16%,transparent); transition:.32s cubic-bezier(.2,.8,.2,1); } .subcategory-card:hover .subcategory-card__symbol{transform:translateY(-4px) scale(1.04)} .subcategory-card__orbit{position:absolute;width:122px;height:54px;border-radius:50%;border:1px solid color-mix(in srgb,var(--accent) 25%,transparent);transform:rotate(-13deg);opacity:.65;animation:subcategoryOrbit 12s linear infinite} .subcategory-card__glow{position:absolute;width:120px;height:120px;border-radius:50%;background:color-mix(in srgb,var(--accent) 18%,transparent);filter:blur(38px);opacity:.65} @keyframes subcategoryOrbit{to{transform:rotate(347deg)}} .subcategory-card__body{padding:21px 21px 10px;flex:1} .subcategory-card__body small{display:block;color:color-mix(in srgb,var(--accent) 74%,#cbe3ff);font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin-bottom:9px} .subcategory-card__body h4{font-size:20px;line-height:1.08;letter-spacing:-.04em;margin:0 0 10px;color:#fff} .subcategory-card__body p{font-size:11px;line-height:1.55;color:#75879b;margin:0} .subcategory-card__footer{min-height:62px;margin:0 20px;padding:15px 0 19px;border-top:1px solid rgba(255,255,255,.055);display:grid;grid-template-columns:1fr auto 24px;align-items:center;gap:10px} .subcategory-card__footer span{font-size:9px;color:#65778b} .subcategory-card__footer strong{font-size:12px;color:#eaf5ff} .subcategory-card__footer b{font-size:17px;color:#61768c;transition:.2s} .subcategory-card:hover .subcategory-card__footer b{color:#fff;transform:translateX(3px)} #catalogProductStage{ padding:28px 0 0; scroll-margin-top:95px; } .catalog-stage-head--products{ padding:22px 24px; border-radius:24px; border:1px solid rgba(115,181,255,.1); background:#030a14; } #catalogProductStage .product-grid{margin-top:18px} .catalog-more{padding-top:34px} .catalog-more button{background:#06111f;border-color:rgba(115,181,255,.12)} .catalog-more button:hover{background:#0a1c33;border-color:rgba(111,181,255,.24)} .catalog-search-main{position:relative;overflow:hidden} .catalog-search-main::after{content:"";position:absolute;inset:-60% auto -60% -30%;width:26%;background:linear-gradient(90deg,transparent,rgba(128,194,255,.08),transparent);transform:rotate(14deg);animation:catalogSearchSweep 9s ease-in-out infinite;pointer-events:none} @keyframes catalogSearchSweep{0%,76%{left:-30%;opacity:0}82%{opacity:1}100%{left:125%;opacity:0}} @media(max-width:1180px){ .catalog-pills--large{grid-template-columns:repeat(2,minmax(0,1fr))} .subcategory-grid{grid-template-columns:repeat(3,minmax(0,1fr))} } @media(max-width:860px){ .subcategory-grid{grid-template-columns:repeat(2,minmax(0,1fr))} .catalog-stage-head{grid-template-columns:1fr auto;gap:13px} .catalog-stage-head .catalog-back{grid-column:1/3;justify-self:start} .catalog-stage-head h3{font-size:25px} } @media(max-width:620px){ .catalog-category-block,.catalog-subcategory-block{padding:16px;border-radius:25px} .catalog-category-block__head{align-items:flex-start;flex-direction:column} .catalog-pills--large{grid-template-columns:1fr;gap:9px} .catalog-pills--large .catalog-pill{min-height:104px;border-radius:21px;padding:17px;grid-template-columns:45px 1fr auto;column-gap:13px} .catalog-pills--large .catalog-pill i{width:45px;height:45px;border-radius:15px;font-size:17px} .catalog-pills--large .catalog-pill span{font-size:15px} .subcategory-grid{grid-template-columns:1fr;gap:12px} .subcategory-card{min-height:280px;border-radius:24px} .subcategory-card__visual{height:128px} .catalog-stage-head{padding:0;grid-template-columns:1fr auto;margin-bottom:18px} .catalog-stage-head--products{padding:17px;border-radius:20px} .catalog-stage-head h3{font-size:22px} } /* === hero confidence + premium Saturn v3.8 === */ .hero{ min-height:900px; padding-top:150px; padding-bottom:110px; } .hero::before{ background: radial-gradient(760px 580px at 86% 42%,rgba(41,131,255,.16),transparent 66%), radial-gradient(420px 300px at 64% 64%,rgba(104,177,255,.07),transparent 72%), linear-gradient(180deg,rgba(2,8,16,.08),transparent 78%)!important; } .hero__content{ width:min(58%,760px); max-width:760px; padding:76px 0 42px 30px; } .hero h1{ font-size:clamp(66px,6.4vw,102px); max-width:760px; } .hero__content>p{max-width:620px} .hero__atmosphere{ overflow:visible; contain:layout paint; } .hero__atmosphere::before{ width:880px; height:880px; right:-220px; top:-190px; background: radial-gradient(circle,rgba(76,157,255,.18) 0%,rgba(35,91,170,.09) 34%,transparent 69%); filter:blur(28px); } .premium-saturn{ position:absolute; right:-20px; top:72px; width:min(59vw,760px); aspect-ratio:820/620; opacity:1; transform-origin:54% 52%; filter:drop-shadow(0 48px 100px rgba(0,0,0,.42)); animation:premiumSaturnFloat 10s ease-in-out infinite; will-change:transform; } .premium-saturn__aura{ position:absolute; inset:4% 0 0 8%; border-radius:50%; background: radial-gradient(circle at 55% 48%,rgba(102,173,255,.20),rgba(34,103,199,.08) 36%,transparent 67%); filter:blur(34px); animation:premiumSaturnAura 7s ease-in-out infinite; } .premium-saturn__svg{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; } .premium-saturn__outer-orbit{ transform-origin:410px 308px; animation:premiumOrbit 34s linear infinite; } .premium-saturn__ring--rear{ transform-origin:410px 308px; animation:premiumRingBreathe 8s ease-in-out infinite; } .premium-saturn__ring--front{ transform-origin:410px 308px; animation:premiumRingFront 8s ease-in-out infinite; } .premium-saturn__planet{ transform-origin:410px 308px; animation:premiumPlanetBreathe 9s ease-in-out infinite; } .premium-saturn__clouds{ transform-origin:410px 308px; animation:premiumCloudDrift 18s ease-in-out infinite alternate; } .premium-saturn__dust{ position:absolute; inset:0; transform-origin:53% 50%; animation:premiumDustSpin 28s linear infinite; } .premium-saturn__dust i{ --r:calc(230px + (var(--n) % 4) * 34px); position:absolute; left:53%; top:50%; width:3px; height:3px; border-radius:50%; background:#d9ebff; box-shadow:0 0 12px rgba(109,176,255,.82); opacity:calc(.26 + (var(--n) % 4) * .13); transform:rotate(calc(var(--n) * 30deg)) translateX(var(--r)); } .premium-saturn__dust i:nth-child(3n){width:5px;height:5px;background:#72b7ff} .premium-saturn__dust i:nth-child(4n){width:2px;height:2px;filter:blur(.2px)} .hero-orbit--one{ width:860px; height:860px; right:-245px; top:-225px; border-color:rgba(101,171,255,.10); } .hero-orbit--two{ width:540px; height:540px; right:35px; bottom:-300px; border-color:rgba(146,199,255,.075); } .hero-glass--one{ width:300px; height:170px; right:5%; top:8%; opacity:.09; filter:blur(8px); } .hero-glass--two{ width:230px; height:210px; right:30%; bottom:3%; opacity:.08; filter:blur(12px); } .hero-categories{ grid-template-columns:repeat(3,minmax(0,1fr)); width:min(720px,100%); } .hero-categories button{ background:linear-gradient(180deg,rgba(6,18,33,.88),rgba(3,10,19,.88)); box-shadow:0 18px 54px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.035); } .hero-categories button:hover{ transform:translateY(-4px); box-shadow:0 24px 72px rgba(0,48,111,.28),0 0 0 1px rgba(85,162,255,.12); } .hero__trust{ margin-top:28px; color:#93a5ba; } .hero__trust span{ padding:9px 12px; border-radius:999px; background:rgba(5,16,29,.56); border:1px solid rgba(108,174,255,.08); } @keyframes premiumSaturnFloat{ 0%,100%{transform:translate3d(0,0,0) rotate(-1.5deg)} 50%{transform:translate3d(0,-14px,0) rotate(.5deg)} } @keyframes premiumSaturnAura{ 0%,100%{opacity:.72;transform:scale(.96)} 50%{opacity:1;transform:scale(1.035)} } @keyframes premiumOrbit{to{transform:rotate(360deg)}} @keyframes premiumRingBreathe{ 0%,100%{transform:rotate(-1deg) scaleX(1)} 50%{transform:rotate(1deg) scaleX(1.012)} } @keyframes premiumRingFront{ 0%,100%{transform:rotate(-.5deg)} 50%{transform:rotate(.7deg)} } @keyframes premiumPlanetBreathe{ 0%,100%{transform:scale(1)} 50%{transform:scale(1.018)} } @keyframes premiumCloudDrift{ from{transform:translateX(-10px) scale(1.02)} to{transform:translateX(12px) scale(1.04)} } @keyframes premiumDustSpin{to{transform:rotate(360deg)}} @media(max-width:1180px){ .hero__content{width:min(64%,720px)} .premium-saturn{right:-150px;width:710px;opacity:.78} } @media(max-width:920px){ .hero{min-height:auto;padding-bottom:70px} .hero__content{width:100%;max-width:720px;padding-right:30px} .premium-saturn{right:-300px;top:120px;width:690px;opacity:.34;filter:blur(.2px) drop-shadow(0 40px 90px rgba(0,0,0,.4))} .hero__atmosphere{overflow:hidden} .hero-categories{width:100%} } @media(max-width:760px){ .hero{padding-top:96px;padding-bottom:48px} .hero__content{padding:54px 14px 34px} .hero h1{font-size:clamp(47px,13vw,60px)} .hero__content>p{max-width:92%;font-size:15px} .premium-saturn{right:-330px;top:132px;width:590px;opacity:.19} .premium-saturn__dust{display:none} .hero-categories{grid-template-columns:1fr 1fr} .hero__trust span{padding:7px 9px} } @media(prefers-reduced-motion:reduce){ .premium-saturn,.premium-saturn__aura,.premium-saturn__outer-orbit,.premium-saturn__ring,.premium-saturn__planet,.premium-saturn__clouds,.premium-saturn__dust{animation:none!important} } /* v3.9 — supplier artwork wrapped in FAZORA visual system */ .subcategory-card.has-cover{min-height:330px;background:#070a10} .subcategory-card.has-cover .subcategory-card__visual{height:178px;background-image:linear-gradient(180deg,rgba(2,5,10,.04) 20%,rgba(2,5,10,.82) 100%),var(--cover);background-size:cover,cover;background-position:center,center;background-repeat:no-repeat;border-bottom:1px solid rgba(255,255,255,.08)} .subcategory-card.has-cover .subcategory-card__visual::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 78% 18%,color-mix(in srgb,var(--accent) 24%,transparent),transparent 38%);mix-blend-mode:screen} .subcategory-card.has-cover .subcategory-card__orbit,.subcategory-card.has-cover .subcategory-card__glow{display:none} .subcategory-card__supplier{position:absolute;left:14px;top:14px;padding:7px 9px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(2,5,10,.56);backdrop-filter:blur(14px);font-size:8px;font-weight:800;letter-spacing:.12em;color:#fff} .subcategory-card.has-cover:hover .subcategory-card__visual{background-size:cover,106%;transition:background-size .65s ease} .product-card__visual.has-cover{background-image:linear-gradient(180deg,rgba(3,6,11,.03) 25%,rgba(3,6,11,.92) 100%),var(--cover);background-size:cover,cover;background-position:center;background-repeat:no-repeat} .product-card__visual.has-cover::before{content:"";position:absolute;inset:0;width:auto;height:auto;border:0;border-radius:inherit;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 14%,transparent),transparent 45%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.05)} .product-card__visual.has-cover .product-card__brand{font-size:22px;max-width:75%;padding:7px 10px;border-radius:10px;background:rgba(2,5,10,.48);backdrop-filter:blur(10px);letter-spacing:-.035em} .product-card__cover-mark{position:absolute;right:13px;top:13px;z-index:3;padding:7px 8px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(2,5,10,.55);backdrop-filter:blur(12px);font-size:7px;font-weight:900;letter-spacing:.13em;color:#fff} @media(max-width:760px){.subcategory-card.has-cover{min-height:280px}.subcategory-card.has-cover .subcategory-card__visual{height:140px}.product-card__visual.has-cover .product-card__brand{font-size:16px}} /* ========================================================================== */ /* FAZORA v4.0 — supplier-shaped product configurator and checkout */ /* ========================================================================== */ .catalog-shell.is-configuring .catalog-toolbar__actions{opacity:.38;pointer-events:none} .product-grid--configurator{display:block!important} .product-grid--configurator+.catalog-more{display:none} /* Covers use the entire supplier asset without aggressive cropping. */ .subcategory-card.has-cover{min-height:344px;background:linear-gradient(165deg,#090e17,#04070c 72%)} .subcategory-card.has-cover .subcategory-card__visual{height:180px;background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--accent) 13%,transparent),transparent 62%),#050911;display:grid;place-items:center;padding:28px;overflow:hidden} .subcategory-card.has-cover .subcategory-card__visual::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,7,13,.02),rgba(3,7,13,.3));pointer-events:none} .subcategory-card.has-cover .subcategory-card__visual::after{bottom:0;inset-inline:12%;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--accent) 40%,transparent),transparent)} .subcategory-card__visual img{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;object-position:center;filter:drop-shadow(0 16px 28px rgba(0,0,0,.44));transform:scale(.9);transition:transform .55s cubic-bezier(.2,.8,.2,1),filter .55s} .subcategory-card.has-cover:hover .subcategory-card__visual img{transform:scale(.96);filter:drop-shadow(0 20px 34px color-mix(in srgb,var(--accent) 18%,rgba(0,0,0,.58)))} .subcategory-card__supplier{z-index:3;left:12px;top:12px;background:rgba(2,6,12,.76)} .product-card__visual.has-cover{background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--accent) 13%,transparent),transparent 65%),#050911;display:flex;align-items:flex-end} .product-card__image{position:absolute;inset:25px 26px 48px;width:calc(100% - 52px);height:calc(100% - 73px);object-fit:contain;object-position:center;filter:drop-shadow(0 15px 22px rgba(0,0,0,.48));transition:transform .5s cubic-bezier(.2,.8,.2,1)} .product-card:hover .product-card__image{transform:scale(1.035)} .product-card__cover-mark{position:absolute;right:14px;top:14px;z-index:3;padding:6px 8px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(2,6,12,.72);font-size:7px;font-weight:850;letter-spacing:.12em;color:#dcecff} .product-card__visual.has-cover .product-card__brand{z-index:3;background:rgba(2,6,12,.72);border:1px solid rgba(255,255,255,.08)} /* One selected game/service becomes one configurator, not a wall of SKUs. */ .service-configurator{border:1px solid color-mix(in srgb,var(--accent) 18%,rgba(255,255,255,.08));border-radius:34px;overflow:hidden;background:linear-gradient(160deg,rgba(10,17,29,.97),rgba(3,7,13,.99) 62%);box-shadow:0 34px 110px rgba(0,0,0,.4),0 0 75px color-mix(in srgb,var(--accent) 5%,transparent)} .service-configurator__hero{min-height:300px;display:grid;grid-template-columns:minmax(300px,.8fr) 1.2fr;border-bottom:1px solid rgba(255,255,255,.075);position:relative;overflow:hidden} .service-configurator__hero::after{content:"";position:absolute;inset:auto 8% -1px;height:1px;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--accent) 55%,transparent),transparent)} .service-configurator__cover{position:relative;display:grid;place-items:center;padding:54px;background:radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--accent) 24%,transparent),transparent 54%),linear-gradient(145deg,color-mix(in srgb,var(--accent) 8%,#07101c),#03070d);overflow:hidden} .service-configurator__cover::before{content:"";position:absolute;width:260px;height:260px;border-radius:50%;border:1px solid color-mix(in srgb,var(--accent) 20%,transparent);box-shadow:0 0 55px color-mix(in srgb,var(--accent) 10%,transparent),inset 0 0 40px color-mix(in srgb,var(--accent) 8%,transparent);animation:configHalo 9s ease-in-out infinite} .service-configurator__cover img{position:relative;z-index:2;width:min(100%,330px);height:180px;object-fit:contain;filter:drop-shadow(0 28px 35px rgba(0,0,0,.5));animation:configFloat 6.5s ease-in-out infinite} .service-configurator__cover>strong{position:relative;z-index:2;font-size:82px} .service-configurator__cover>span{position:absolute;left:20px;bottom:18px;z-index:3;padding:8px 10px;border:1px solid rgba(255,255,255,.11);border-radius:999px;background:rgba(2,6,12,.65);font-size:8px;font-weight:850;letter-spacing:.14em;color:#d9ebff} .service-configurator__intro{padding:60px 58px;display:flex;flex-direction:column;justify-content:center;background:radial-gradient(circle at 90% 20%,color-mix(in srgb,var(--accent) 9%,transparent),transparent 40%)} .service-configurator__intro>small{font-size:9px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:color-mix(in srgb,var(--accent) 72%,#d9eaff)} .service-configurator__intro h3{font-size:clamp(40px,5vw,72px);line-height:.94;letter-spacing:-.065em;margin:16px 0 18px;color:#fff} .service-configurator__intro>p{max-width:630px;margin:0;color:#8da0b7;font-size:15px;line-height:1.65} .service-configurator__intro>div{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px} .service-configurator__intro>div span{padding:9px 12px;border-radius:999px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.075);font-size:9px;color:#b6c4d5} .service-configurator__workspace{display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:28px;padding:30px} .service-configurator__form{display:grid;gap:18px} .config-section{border:1px solid rgba(255,255,255,.075);border-radius:25px;background:rgba(255,255,255,.018);padding:25px} .config-section>header{display:flex;align-items:flex-start;gap:15px;margin-bottom:22px} .config-section>header>b{width:38px;height:38px;border-radius:13px;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 15%,rgba(255,255,255,.035));border:1px solid color-mix(in srgb,var(--accent) 28%,rgba(255,255,255,.06));color:color-mix(in srgb,var(--accent) 70%,white);font-size:10px} .config-section>header div{display:flex;flex-direction:column;gap:5px} .config-section>header strong{font-size:17px;color:#f8fbff} .config-section>header span{font-size:10px;color:#6e8197} .config-offers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px} .config-offer{min-height:96px;border:1px solid rgba(255,255,255,.085);border-radius:18px;background:#070c14;color:#fff;padding:15px;text-align:left;display:flex;flex-direction:column;position:relative;transition:.22s} .config-offer:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 32%,rgba(255,255,255,.12))} .config-offer.active{border-color:color-mix(in srgb,var(--accent) 62%,white);background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 14%,#08101b),#060b12);box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 18%,transparent),0 16px 38px rgba(0,0,0,.25)} .config-offer span{font-size:12px;font-weight:750;color:#f3f8ff} .config-offer strong{font-size:17px;margin-top:auto;padding-top:12px} .config-offer small{position:absolute;right:11px;top:11px;font-size:7px;letter-spacing:.08em;text-transform:uppercase;color:#6f849b} .config-offer.active::after{content:"✓";position:absolute;right:11px;bottom:10px;width:20px;height:20px;border-radius:7px;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 70%,white);color:#02060b;font-size:10px;font-weight:900} .config-amount-grid{display:grid;grid-template-columns:200px 1fr;gap:12px} .config-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px} .config-field{display:flex;flex-direction:column;gap:8px;position:relative} .config-field--wide{grid-column:1/-1} .config-field>span{font-size:10px;color:#8b9db2;font-weight:700} .config-field input,.config-field select{width:100%;height:57px;border:1px solid rgba(255,255,255,.1);border-radius:16px;background:#050a12;color:#f6fbff;outline:none;padding:0 15px;font-size:14px;transition:.2s} .config-field input:focus,.config-field select:focus{border-color:color-mix(in srgb,var(--accent) 55%,white);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 8%,transparent)} .config-field>small{font-size:8px;color:#60748c;line-height:1.45} .config-field>small.success{color:#55df9b}.config-field>small.error{color:#ff7f8a}.config-field>small.loading{color:#78b8ff} .amount-input{height:67px;border:1px solid rgba(255,255,255,.1);border-radius:18px;background:#050a12;display:flex;align-items:center;padding:0 15px;transition:.2s} .amount-input:focus-within{border-color:color-mix(in srgb,var(--accent) 55%,white);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 8%,transparent)} .amount-input input{height:auto;border:0;background:transparent;padding:0;font-size:26px;font-weight:800;letter-spacing:-.035em;box-shadow:none!important} .amount-input b{font-size:11px;color:#6f859d;padding-left:12px} .currency-switch{height:67px;padding:5px;border:1px solid rgba(255,255,255,.1);border-radius:18px;background:#050a12;display:grid;grid-template-columns:repeat(3,1fr);gap:4px} .currency-switch button{border:0;border-radius:13px;background:transparent;color:#6e8198;font-size:11px;font-weight:800} .currency-switch button.active{background:#f2f7ff;color:#04080d;box-shadow:0 5px 20px rgba(219,235,255,.12)} .login-check{position:absolute;right:7px;top:28px;height:43px;padding:0 14px;border:0;border-radius:12px;background:rgba(255,255,255,.075);color:#e9f3ff;font-size:9px;font-weight:800} .config-field:has(.login-check) input{padding-right:130px} .config-no-fields{grid-column:1/-1;padding:18px;border:1px dashed rgba(255,255,255,.1);border-radius:16px;color:#71869e;font-size:11px} .config-summary{align-self:start;position:sticky;top:96px;border:1px solid color-mix(in srgb,var(--accent) 22%,rgba(255,255,255,.08));border-radius:25px;background:linear-gradient(160deg,color-mix(in srgb,var(--accent) 7%,#09111d),#050910 72%);padding:25px;box-shadow:0 24px 60px rgba(0,0,0,.3)} .config-summary>small{font-size:8px;font-weight:850;letter-spacing:.16em;color:color-mix(in srgb,var(--accent) 72%,#dcecff)} .config-summary h4{font-size:22px;line-height:1.15;letter-spacing:-.04em;margin:16px 0 24px;color:#fff} .config-summary__line{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 0;border-top:1px solid rgba(255,255,255,.06)} .config-summary__line span{font-size:10px;color:#6d8198}.config-summary__line strong{font-size:11px;color:#dbe8f7;text-align:right} .config-summary__total{display:flex;justify-content:space-between;align-items:flex-end;border-top:1px solid rgba(255,255,255,.1);margin-top:7px;padding-top:21px} .config-summary__total span{font-size:11px;color:#8a9db2}.config-summary__total strong{font-size:28px;letter-spacing:-.045em} .config-summary>button{width:100%;height:58px;margin-top:22px;border:0;border-radius:16px;background:linear-gradient(135deg,#f5f9ff,#bcdcff);color:#03070c;font-size:11px;font-weight:900;display:flex;align-items:center;justify-content:center;gap:12px;transition:.2s} .config-summary>button:hover{transform:translateY(-2px);box-shadow:0 15px 40px rgba(115,176,255,.18)} .config-summary>p{font-size:8px;line-height:1.55;color:#5f7288;text-align:center;margin:13px 10px 0} /* Premium checkout sheet */ .cart-drawer .drawer__backdrop{background:rgba(0,3,8,.76);backdrop-filter:blur(10px)} .cart-panel{width:min(650px,100vw)!important;background:radial-gradient(circle at 90% 0,rgba(34,112,210,.13),transparent 33%),#03070d!important;border-left:1px solid rgba(112,176,255,.16)!important;box-shadow:-40px 0 120px rgba(0,0,0,.52)} .cart-panel__header{height:auto!important;min-height:122px;padding:26px 30px!important;background:rgba(255,255,255,.012)} .cart-panel__header h3{font-size:34px!important;letter-spacing:-.05em;margin:4px 0!important}.cart-panel__header p{margin:7px 0 0;color:#6f8298;font-size:10px} .cart-panel__steps{height:63px;display:flex;align-items:center;padding:0 30px;border-bottom:1px solid rgba(255,255,255,.065);background:#040910} .cart-panel__steps span{display:flex;align-items:center;gap:7px;font-size:9px;color:#52677f;white-space:nowrap}.cart-panel__steps span b{width:23px;height:23px;border-radius:8px;display:grid;place-items:center;background:rgba(255,255,255,.045);font-size:8px} .cart-panel__steps span.active{color:#ddecff}.cart-panel__steps span.active b{background:#eaf4ff;color:#02060b}.cart-panel__steps i{height:1px;flex:1;margin:0 10px;background:rgba(255,255,255,.07)} .cart-panel__content{padding:22px 26px!important;background:linear-gradient(180deg,rgba(255,255,255,.01),transparent)} .drawer-item--cart{grid-template-columns:92px minmax(0,1fr) auto!important;gap:16px!important;padding:14px!important;margin-bottom:12px!important;border-radius:21px!important;background:linear-gradient(145deg,rgba(255,255,255,.037),rgba(255,255,255,.012))!important;border-color:rgba(255,255,255,.08)!important} .drawer-item__art{width:92px!important;height:92px!important;border-radius:17px!important;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 18%,transparent),transparent 70%),#070d16!important;overflow:hidden} .drawer-item__art img{width:100%;height:100%;object-fit:contain;padding:14px;filter:drop-shadow(0 9px 14px rgba(0,0,0,.44))} .drawer-item__main{min-width:0;display:flex;flex-direction:column}.drawer-item__main>small{font-size:7px;color:color-mix(in srgb,var(--accent) 66%,#a9bdd3);letter-spacing:.1em;text-transform:uppercase}.drawer-item__main h4{font-size:14px!important;line-height:1.25;margin:6px 0 4px!important;color:#f8fbff}.drawer-item__main>p{font-size:9px!important;color:#75899f!important;margin:0 0 8px!important}.drawer-item__main>strong{font-size:16px;margin-top:auto;color:#fff} .drawer-item__details{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:8px}.drawer-item__details span{max-width:180px;overflow:hidden;text-overflow:ellipsis;padding:5px 7px;border-radius:7px;background:rgba(255,255,255,.045);font-size:7px;color:#9bb0c6;white-space:nowrap} .drawer-item__actions{display:flex;align-items:flex-end;justify-content:space-between;flex-direction:column;gap:12px}.drawer-item__remove{position:static!important;width:30px!important;height:30px!important;border-radius:10px!important;background:rgba(255,255,255,.04)!important;border:1px solid rgba(255,255,255,.07)!important;color:#75889c!important;font-size:16px} .cart-qty{height:32px;display:flex;align-items:center;border:1px solid rgba(255,255,255,.08);border-radius:10px;overflow:hidden}.cart-qty button{width:29px;height:100%;border:0;background:transparent;color:#9aacc0}.cart-qty span{width:28px;text-align:center;font-size:9px;color:#fff}.cart-one-time{font-size:8px;color:#657a91;padding:7px 9px;border-radius:9px;background:rgba(255,255,255,.035)} .cart-panel__footer{padding:23px 28px 25px!important;background:#050a11!important;border-top:1px solid rgba(255,255,255,.075)!important} .cart-assurance{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:17px}.cart-assurance span{padding:7px 8px;border:1px solid rgba(255,255,255,.07);border-radius:8px;background:rgba(255,255,255,.025);font-size:7px;color:#7790aa} .cart-summary-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0}.cart-summary-row span{font-size:10px;color:#8295aa}.cart-summary-row strong{font-size:12px}.cart-summary-row--muted strong{color:#61d99a} .cart-summary-total{display:flex;justify-content:space-between;align-items:flex-end;border-top:1px solid rgba(255,255,255,.09);margin-top:10px;padding-top:18px}.cart-summary-total>div{display:flex;flex-direction:column;gap:5px}.cart-summary-total span{font-size:12px;color:#dce9f8}.cart-summary-total small{font-size:7px;color:#566b82}.cart-summary-total>strong{font-size:31px;letter-spacing:-.05em} .cart-panel__footer>button{height:61px!important;margin-top:20px;border-radius:17px!important;background:linear-gradient(135deg,#f5f9ff,#bddcff)!important;display:flex;align-items:center;justify-content:center;gap:12px}.cart-panel__footer>button:disabled{opacity:.38;cursor:not-allowed}.cart-panel__legal{text-align:center;font-size:7px;color:#52677e;line-height:1.5;margin:12px 10px 0} .cart-empty{min-height:260px;display:flex;align-items:center;justify-content:center;text-align:center;padding:45px!important;border:1px dashed rgba(255,255,255,.08);border-radius:22px!important;background:radial-gradient(circle at 50% 30%,rgba(52,130,224,.08),transparent 48%)} .modal-cover-image{position:absolute;inset:55px;width:calc(100% - 110px);height:calc(100% - 110px);object-fit:contain;filter:drop-shadow(0 28px 40px rgba(0,0,0,.5))}.product-modal__visual{position:relative}.product-modal__visual .modal-cover-image+strong{position:absolute;left:34px;bottom:30px;z-index:2;font-size:30px!important;text-shadow:0 10px 30px #000} .product-field input[type=number]{font-variant-numeric:tabular-nums} @keyframes configFloat{0%,100%{transform:translateY(0) scale(.92)}50%{transform:translateY(-8px) scale(.95)}} @keyframes configHalo{0%,100%{transform:scale(.94);opacity:.65}50%{transform:scale(1.04);opacity:1}} @media(max-width:1050px){ .service-configurator__hero{grid-template-columns:310px 1fr}.service-configurator__intro{padding:45px 38px}.service-configurator__workspace{grid-template-columns:1fr}.config-summary{position:static}.config-offers{grid-template-columns:repeat(2,minmax(0,1fr))} } @media(max-width:760px){ .subcategory-card.has-cover{min-height:294px}.subcategory-card.has-cover .subcategory-card__visual{height:145px;padding:20px}.subcategory-card__visual img{transform:scale(.88)} .service-configurator{border-radius:25px}.service-configurator__hero{grid-template-columns:1fr;min-height:0}.service-configurator__cover{min-height:210px;padding:38px}.service-configurator__cover img{height:125px}.service-configurator__intro{padding:32px 24px}.service-configurator__intro h3{font-size:40px}.service-configurator__intro>p{font-size:12px}.service-configurator__intro>div{margin-top:20px} .service-configurator__workspace{padding:12px;gap:12px}.config-section{padding:18px;border-radius:20px}.config-amount-grid,.config-fields{grid-template-columns:1fr}.config-offers{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.config-offer{min-height:91px;padding:12px}.config-summary{border-radius:20px;padding:20px} .cart-panel__header{min-height:104px;padding:21px 20px!important}.cart-panel__header h3{font-size:29px!important}.cart-panel__steps{padding:0 18px}.cart-panel__steps span{font-size:0}.cart-panel__steps span b{font-size:8px}.cart-panel__content{padding:14px!important}.drawer-item--cart{grid-template-columns:72px minmax(0,1fr) auto!important;gap:11px!important;padding:10px!important}.drawer-item__art{width:72px!important;height:72px!important}.drawer-item__main h4{font-size:12px!important}.drawer-item__details{display:none}.cart-panel__footer{padding:18px!important} } .is-gift-card .config-offers{grid-template-columns:repeat(3,minmax(0,1fr))} .is-gift-card .config-offer--gift{min-height:142px;border-radius:22px;padding:18px;background:radial-gradient(circle at 82% 18%,color-mix(in srgb,var(--accent) 30%,transparent),transparent 38%),linear-gradient(145deg,color-mix(in srgb,var(--accent) 15%,#101a28),#060a11 72%);overflow:hidden} .is-gift-card .config-offer--gift::before{content:"FAZORA";position:absolute;left:17px;top:16px;font-size:9px;font-weight:900;letter-spacing:.18em;color:rgba(255,255,255,.75)} .is-gift-card .config-offer--gift::after{content:"DIGITAL CARD";position:absolute;right:15px;bottom:14px;width:auto;height:auto;border-radius:0;background:transparent;color:rgba(255,255,255,.4);font-size:7px;letter-spacing:.13em} .is-gift-card .config-offer--gift span{margin-top:35px;font-size:18px;letter-spacing:-.03em}.is-gift-card .config-offer--gift strong{font-size:13px}.is-gift-card .config-offer--gift small{top:auto;right:auto;left:17px;bottom:15px} .is-gift-card .config-offer--gift.active{box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 45%,white),0 22px 50px rgba(0,0,0,.3)} @media(max-width:760px){.is-gift-card .config-offers{grid-template-columns:1fr 1fr}.is-gift-card .config-offer--gift{min-height:125px}} /* v4.0 mobile checkout: keep notifications above the primary action */ @media(max-width:760px){ .cart-drawer.open ~ .toast, body:has(.cart-drawer.open) .toast{bottom:112px} } /* === v4.1 richer branded product cards === */ .brand-cover{position:relative;z-index:1;width:100%;height:100%;border-radius:22px;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:18px} .brand-cover__mesh{position:absolute;inset:0;background: linear-gradient(135deg,rgba(255,255,255,.06),transparent 42%), radial-gradient(circle at 18% 18%,color-mix(in srgb,var(--accent) 16%,transparent),transparent 34%), radial-gradient(circle at 84% 82%,rgba(255,255,255,.05),transparent 24%), linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,0));opacity:.9} .brand-cover__badge{position:relative;z-index:2;align-self:flex-start;padding:7px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.10);background:rgba(3,8,16,.54);backdrop-filter:blur(10px);font-size:10px;font-weight:800;letter-spacing:.14em;color:#eef6ff} .brand-cover__orb{position:absolute;right:-14px;top:-10px;width:126px;height:126px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 32%,rgba(255,255,255,.1)),transparent 65%);filter:blur(4px);opacity:.9} .brand-cover__logo{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;flex:1;padding:6px 16px} .brand-cover__logo img{max-width:72%;max-height:64px;object-fit:contain;filter:drop-shadow(0 20px 25px rgba(0,0,0,.42))} .brand-cover__copy{position:relative;z-index:2;display:flex;flex-direction:column;gap:6px} .brand-cover__copy strong{font-size:22px;line-height:1;letter-spacing:-.05em;color:#f6faff} .brand-cover__copy span{font-size:12px;line-height:1.35;color:#b9cde6;max-width:85%} .product-card__visual.has-brand-panel{padding:0!important;background:linear-gradient(155deg,color-mix(in srgb,var(--accent) 7%,#08111b),#050911 74%)!important;display:block} .product-card__visual.has-brand-panel .product-card__brand{z-index:3;left:16px;bottom:14px;right:auto;max-width:none;background:rgba(2,6,12,.68);border:1px solid rgba(255,255,255,.08)} .product-card__visual.has-brand-panel .product-card__image{display:none} .product-card__visual.has-brand-panel::before{background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,0))} .product-card:hover .brand-cover__logo img{transform:scale(1.04)} .product-card:hover .brand-cover__orb{transform:scale(1.06);opacity:1} .subcategory-card.has-brand-panel{background:linear-gradient(165deg,#090e17,#04070c 72%)} .subcategory-card__visual.has-brand-panel{padding:0!important;background:linear-gradient(155deg,color-mix(in srgb,var(--accent) 9%,#08111b),#04080f 74%)!important;display:block} .subcategory-card__visual.has-brand-panel img{display:none} .brand-cover--subcategory{padding:18px 18px 16px;height:100%} .brand-cover--subcategory .brand-cover__logo img{max-height:58px;max-width:68%} .brand-cover--subcategory .brand-cover__copy strong{font-size:24px} .brand-cover--subcategory .brand-cover__copy span{font-size:12px;max-width:88%} .brand-cover[data-art="steam"] .brand-cover__mesh, .brand-cover[data-art="steam-balance"] .brand-cover__mesh{background: linear-gradient(135deg,rgba(255,255,255,.06),transparent 42%), radial-gradient(circle at 18% 18%,rgba(106,196,255,.22),transparent 34%), radial-gradient(circle at 84% 82%,rgba(255,255,255,.05),transparent 24%), linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,0));} .brand-cover[data-art^="telegram"] .brand-cover__mesh{background: linear-gradient(135deg,rgba(255,255,255,.05),transparent 42%), radial-gradient(circle at 18% 18%,rgba(0,194,255,.22),transparent 34%), radial-gradient(circle at 84% 82%,rgba(255,255,255,.05),transparent 24%), linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,0));} .brand-cover[data-art="playstation"] .brand-cover__mesh{background: linear-gradient(135deg,rgba(255,255,255,.06),transparent 42%), radial-gradient(circle at 18% 18%,rgba(68,115,255,.26),transparent 34%), radial-gradient(circle at 84% 82%,rgba(255,255,255,.05),transparent 24%), linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,0));} .brand-cover[data-art="xbox"] .brand-cover__mesh{background: linear-gradient(135deg,rgba(255,255,255,.06),transparent 42%), radial-gradient(circle at 18% 18%,rgba(112,234,126,.20),transparent 34%), radial-gradient(circle at 84% 82%,rgba(255,255,255,.05),transparent 24%), linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,0));} .brand-cover[data-art="apple"] .brand-cover__mesh, .brand-cover[data-art="google-play"] .brand-cover__mesh, .brand-cover[data-art="amazon"] .brand-cover__mesh{background: linear-gradient(135deg,rgba(255,255,255,.07),transparent 42%), radial-gradient(circle at 18% 18%,rgba(226,236,255,.18),transparent 34%), radial-gradient(circle at 84% 82%,rgba(255,255,255,.05),transparent 24%), linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,0));} .brand-cover[data-art="discord"] .brand-cover__mesh{background: linear-gradient(135deg,rgba(255,255,255,.06),transparent 42%), radial-gradient(circle at 18% 18%,rgba(115,137,218,.24),transparent 34%), radial-gradient(circle at 84% 82%,rgba(255,255,255,.05),transparent 24%), linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,0));} .brand-cover[data-art="spotify"] .brand-cover__mesh{background: linear-gradient(135deg,rgba(255,255,255,.06),transparent 42%), radial-gradient(circle at 18% 18%,rgba(38,222,129,.22),transparent 34%), radial-gradient(circle at 84% 82%,rgba(255,255,255,.05),transparent 24%), linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,0));} .brand-cover[data-art="netflix"] .brand-cover__mesh{background: linear-gradient(135deg,rgba(255,255,255,.03),transparent 42%), radial-gradient(circle at 18% 18%,rgba(255,74,74,.24),transparent 34%), radial-gradient(circle at 84% 82%,rgba(255,255,255,.05),transparent 24%), linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,0));} @media(max-width:760px){ .brand-cover{padding:14px} .brand-cover__copy strong{font-size:18px} .brand-cover__copy span{font-size:11px;max-width:100%} .brand-cover__logo img{max-height:48px} } /* ========================================================================== */ /* FAZORA v4.2 — unified catalog media format */ /* ========================================================================== */ .subcategory-grid{gap:20px!important} .subcategory-card{min-height:308px!important;border-radius:28px!important;overflow:hidden} .subcategory-card.has-cover{min-height:308px!important} .subcategory-card.has-cover .subcategory-card__visual{ box-sizing:border-box!important; width:auto!important; height:148px!important; margin:12px 12px 0!important; padding:0!important; border:1px solid rgba(255,255,255,.075)!important; border-radius:20px!important; background:#07101a!important; overflow:hidden!important; } .subcategory-card__supplier{ left:12px!important; top:12px!important; padding:6px 9px!important; font-size:7px!important; letter-spacing:.1em!important; background:rgba(2,7,14,.72)!important; border-color:rgba(255,255,255,.12)!important; } .subcategory-card__body{padding:18px 21px 8px!important} .subcategory-card__body h4{font-size:19px!important;margin-bottom:8px!important} .subcategory-card__body p{font-size:10px!important;line-height:1.48!important} .subcategory-card__footer{min-height:55px!important;padding:12px 0 15px!important} .brand-cover{ position:relative; width:100%; height:100%; padding:0!important; border-radius:19px!important; overflow:hidden; isolation:isolate; } .brand-cover__mesh{ position:absolute; inset:0; background: linear-gradient(125deg,rgba(255,255,255,.055),transparent 38%), radial-gradient(circle at 25% 30%,color-mix(in srgb,var(--accent) 25%,transparent),transparent 34%), radial-gradient(circle at 76% 68%,color-mix(in srgb,var(--accent) 11%,transparent),transparent 30%), linear-gradient(160deg,#0a1522,#040911 76%); } .brand-cover__mesh::after{ content:""; position:absolute; inset:0; opacity:.22; background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px); background-size:22px 22px; mask-image:linear-gradient(115deg,#000,transparent 75%); } .brand-cover__badge{ position:absolute!important; z-index:5; right:11px; top:11px; padding:6px 8px!important; border-radius:999px; border:1px solid rgba(255,255,255,.1); background:rgba(3,8,15,.62); color:#cfe4fb; font-size:7px!important; font-weight:850; letter-spacing:.12em!important; } .brand-cover__scene{position:absolute;inset:0;display:grid;place-items:center;z-index:2} .brand-cover__disc{ position:relative; width:82px; height:82px; display:grid; place-items:center; border-radius:28px; border:1px solid rgba(255,255,255,.13); background:linear-gradient(145deg,rgba(255,255,255,.11),rgba(255,255,255,.025)); box-shadow:0 18px 38px rgba(0,0,0,.42),0 0 32px color-mix(in srgb,var(--accent) 13%,transparent),inset 0 1px rgba(255,255,255,.1); transform:rotate(-5deg); transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s ease; } .brand-cover__disc::before{ content:""; position:absolute; inset:7px; border:1px solid color-mix(in srgb,var(--accent) 24%,rgba(255,255,255,.05)); border-radius:22px; } .brand-cover__disc img{ position:relative!important; z-index:2; width:43px!important; height:43px!important; max-width:43px!important; max-height:43px!important; object-fit:contain!important; padding:0!important; transform:none!important; filter:brightness(0) invert(1) drop-shadow(0 8px 13px rgba(0,0,0,.35))!important; } .brand-cover__glyph{ position:relative; z-index:2; font-size:48px; line-height:1; color:#fff; text-shadow:0 0 24px color-mix(in srgb,var(--accent) 70%,transparent); } .brand-cover__ring{ position:absolute; z-index:1; left:50%; top:54%; border:1px solid color-mix(in srgb,var(--accent) 28%,transparent); border-radius:50%; transform:translate(-50%,-50%) rotate(-10deg); } .brand-cover__ring--one{width:154px;height:49px;opacity:.58} .brand-cover__ring--two{width:118px;height:36px;opacity:.32;transform:translate(-50%,-50%) rotate(13deg)} .brand-cover__spark{position:absolute;z-index:3;width:4px;height:4px;border-radius:50%;background:#fff;box-shadow:0 0 11px color-mix(in srgb,var(--accent) 80%,#fff)} .brand-cover__spark--one{left:22%;top:30%}.brand-cover__spark--two{right:21%;bottom:25%;width:3px;height:3px} .subcategory-card:hover .brand-cover__disc{transform:translateY(-3px) rotate(0deg);box-shadow:0 22px 46px rgba(0,0,0,.46),0 0 38px color-mix(in srgb,var(--accent) 18%,transparent),inset 0 1px rgba(255,255,255,.1)} /* Keep real game artwork inside the same FAZORA frame. */ .subcategory-card.has-cover:not(.has-brand-panel) .subcategory-card__visual{padding:14px!important} .subcategory-card.has-cover:not(.has-brand-panel) .subcategory-card__visual img{ width:100%!important; height:100%!important; max-width:100%!important; max-height:100%!important; object-fit:contain!important; object-position:center!important; transform:scale(.78)!important; filter:drop-shadow(0 12px 20px rgba(0,0,0,.45))!important; } .subcategory-card.has-cover:not(.has-brand-panel):hover .subcategory-card__visual img{transform:scale(.83)!important} /* Product SKU cards use the same compact media language. */ .product-card__visual.has-brand-panel{height:156px!important;padding:10px!important} .product-card__visual.has-brand-panel .brand-cover{border-radius:17px!important} .product-card__visual.has-brand-panel .brand-cover__disc{width:76px;height:76px;border-radius:25px} .product-card__visual.has-brand-panel .brand-cover__disc img{width:39px!important;height:39px!important;max-width:39px!important;max-height:39px!important} .product-card__visual.has-brand-panel .product-card__brand{display:none!important} .product-card__visual.has-brand-panel .product-card__cover-mark{right:18px!important;top:18px!important} @media(max-width:760px){ .subcategory-grid{gap:14px!important} .subcategory-card,.subcategory-card.has-cover{min-height:286px!important;border-radius:24px!important} .subcategory-card.has-cover .subcategory-card__visual{height:132px!important;margin:10px 10px 0!important;border-radius:17px!important} .brand-cover{border-radius:16px!important} .brand-cover__disc{width:70px;height:70px;border-radius:23px} .brand-cover__disc img{width:37px!important;height:37px!important;max-width:37px!important;max-height:37px!important} .brand-cover__ring--one{width:132px;height:42px}.brand-cover__ring--two{width:101px;height:31px} } /* === v4.3 no-empty branded cards + tighter media === */ .product-grid{gap:22px} .subcategory-grid{gap:22px} .product-card__visual, .subcategory-card__visual{height:176px !important;padding:12px 12px 0 12px} .product-card__visual.has-cover, .subcategory-card.has-cover .subcategory-card__visual{overflow:hidden} .product-card__image, .subcategory-card__visual > img{width:100%;height:100%;object-fit:cover;object-position:center center;border-radius:18px;transform:scale(1.01)} .brand-cover{border-radius:18px;padding:14px 14px 12px;background:linear-gradient(165deg,#09111d,#050912 72%);border:1px solid rgba(255,255,255,.06)} .brand-cover__logo{min-height:72px;padding:2px 10px 0 10px} .brand-cover__logo img{max-width:58%;max-height:44px} .brand-cover__fallback{display:none;place-items:center;width:64px;height:64px;border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.10);font-size:28px;font-weight:900;color:#fff;box-shadow:0 12px 28px rgba(0,0,0,.28)} .brand-cover__copy{gap:4px} .brand-cover__copy strong{font-size:20px} .brand-cover__copy span{font-size:11px;max-width:100%} .brand-cover__orb{width:96px;height:96px;right:-8px;top:-6px;opacity:.75} .brand-cover__badge{font-size:9px;padding:6px 9px} .subcategory-card.has-brand-panel .brand-cover--subcategory .brand-cover__logo{min-height:66px} .subcategory-card.has-brand-panel .brand-cover--subcategory .brand-cover__logo img{max-height:40px;max-width:56%} .subcategory-card.has-brand-panel .brand-cover--subcategory .brand-cover__copy strong{font-size:18px} .subcategory-card.has-brand-panel .brand-cover--subcategory .brand-cover__copy span{font-size:11px} .product-card__brand{font-size:13px} .product-card__body{padding-top:12px} .product-card h3{font-size:17px} .product-card__meta{font-size:13px} .subcategory-card__body h4{font-size:22px} /* brand-specific compact themes */ .brand-cover[data-art="steam"], .brand-cover[data-art="steam-balance"]{background:linear-gradient(145deg,#0c1a2f,#060a13 74%)} .brand-cover[data-art^="telegram"]{background:linear-gradient(145deg,#0a1a27,#060912 74%)} .brand-cover[data-art="spotify"]{background:linear-gradient(145deg,#0b1814,#050912 74%)} .brand-cover[data-art="discord"]{background:linear-gradient(145deg,#111427,#060912 74%)} .brand-cover[data-art="netflix"]{background:linear-gradient(145deg,#1b0b0b,#060912 74%)} .brand-cover[data-art="windows"], .brand-cover[data-art="microsoft"]{background:linear-gradient(145deg,#0a1821,#060912 74%)} .brand-cover[data-art="yandex"]{background:linear-gradient(145deg,#1a170a,#060912 74%)} @media(max-width:760px){ .product-grid,.subcategory-grid{gap:14px} .product-card__visual,.subcategory-card__visual{height:150px !important;padding:10px 10px 0 10px} .brand-cover{padding:12px} .brand-cover__logo{min-height:58px} .brand-cover__logo img{max-height:36px;max-width:54%} .brand-cover__fallback{width:52px;height:52px;font-size:24px} .brand-cover__copy strong{font-size:17px} .subcategory-card__body h4{font-size:18px} } /* === v4.4 local, never-empty service artwork === */ .brand-cover__disc svg{width:52px;height:52px;display:block;color:#f5fbff;filter:drop-shadow(0 10px 18px rgba(0,0,0,.36))} .brand-cover__letter{display:grid;place-items:center;width:100%;height:100%;font-size:30px;font-weight:900;letter-spacing:-.08em;color:#f5fbff;text-shadow:0 10px 24px rgba(0,0,0,.42)} .brand-cover[data-art="spotify"] .brand-cover__disc svg{color:#1ed760} .brand-cover[data-art="discord"] .brand-cover__disc svg{color:#9ba7ff} .brand-cover[data-art="netflix"] .brand-cover__disc svg{color:#ff3341} .brand-cover[data-art="yandex"] .brand-cover__letter{color:#ffd52a} .brand-cover[data-art="windows"] .brand-cover__disc svg, .brand-cover[data-art="microsoft"] .brand-cover__disc svg{color:#6cc9ff} .brand-cover[data-art^="telegram"] .brand-cover__disc svg{color:#eaf8ff} .brand-cover[data-art="steam"] .brand-cover__disc svg, .brand-cover[data-art="steam-balance"] .brand-cover__disc svg{color:#eaf6ff} /* === v4.5 official brand assets only === */ .brand-cover__disc, .brand-cover__glyph, .brand-cover__letter{display:none!important} .brand-cover__scene{position:absolute;inset:0;z-index:2;display:grid;place-items:center;padding:38px 24px 26px} .brand-cover__official-logo{position:relative;display:grid;place-items:center;width:min(76%,250px);height:86px;border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.025));border:1px solid rgba(255,255,255,.09);box-shadow:0 22px 46px rgba(0,0,0,.34),inset 0 1px rgba(255,255,255,.08);overflow:hidden} .brand-cover__official-logo img{position:relative;z-index:2;display:block;max-width:68%;max-height:46px;width:auto;height:auto;object-fit:contain;filter:drop-shadow(0 10px 18px rgba(0,0,0,.34));opacity:0;transition:opacity .2s ease,transform .45s cubic-bezier(.2,.8,.2,1)} .brand-cover__official-logo.is-loaded img{opacity:1} .brand-cover__official-logo.is-loaded .brand-cover__wordmark{opacity:0} .brand-cover__wordmark{position:absolute;z-index:1;inset:0;display:grid;place-items:center;padding:12px;text-align:center;font-size:19px;font-weight:850;line-height:1.05;letter-spacing:-.035em;color:#f4f8ff;transition:opacity .18s ease} .subcategory-card:hover .brand-cover__official-logo img, .product-card:hover .brand-cover__official-logo img{transform:scale(1.035)} .brand-cover[data-art="steam"] .brand-cover__official-logo img, .brand-cover[data-art="steam-balance"] .brand-cover__official-logo img{max-height:50px;max-width:50%} .brand-cover[data-art^="telegram"] .brand-cover__official-logo img{max-height:48px;max-width:52%} .brand-cover[data-art="discord"] .brand-cover__official-logo img{max-height:42px;max-width:72%} .brand-cover[data-art="spotify"] .brand-cover__official-logo img{max-height:50px;max-width:50%} .brand-cover[data-art="netflix"] .brand-cover__official-logo img{max-height:38px;max-width:66%} .brand-cover[data-art="yandex"] .brand-cover__official-logo img{max-height:38px;max-width:70%} .brand-cover[data-art="windows"] .brand-cover__official-logo img, .brand-cover[data-art="microsoft"] .brand-cover__official-logo img{max-height:42px;max-width:68%} .brand-cover[data-art="apple"] .brand-cover__official-logo img{filter:invert(1) drop-shadow(0 10px 18px rgba(0,0,0,.34));max-height:48px;max-width:48%} .brand-cover[data-art="google-play"] .brand-cover__official-logo img{max-height:42px;max-width:72%} .brand-cover[data-art="amazon"] .brand-cover__official-logo img{filter:brightness(0) invert(1) drop-shadow(0 10px 18px rgba(0,0,0,.34));max-height:40px;max-width:68%} .brand-cover[data-art="playstation"] .brand-cover__official-logo img, .brand-cover[data-art="xbox"] .brand-cover__official-logo img{max-height:48px;max-width:58%} .brand-cover__ring{opacity:.22!important} .brand-cover__ring--one{width:148px!important;height:48px!important} .brand-cover__ring--two{width:112px!important;height:35px!important} @media(max-width:760px){ .brand-cover__scene{padding:30px 18px 22px} .brand-cover__official-logo{width:min(78%,220px);height:72px;border-radius:20px} .brand-cover__official-logo img{max-height:38px} .brand-cover__wordmark{font-size:16px} } /* === v4.6 scene-based brand cards with real images in smaller logo chip === */ .brand-cover{position:relative;width:100%;height:100%;padding:0!important;border-radius:19px!important;overflow:hidden;isolation:isolate;background:linear-gradient(160deg,#08111c,#040912 76%)} .brand-cover__mesh{position:absolute;inset:0;background: radial-gradient(circle at 20% 18%, color-mix(in srgb,var(--accent) 18%,transparent), transparent 30%), radial-gradient(circle at 82% 76%, rgba(255,255,255,.04), transparent 20%), linear-gradient(160deg,#0a1522,#040911 76%)} .brand-cover__mesh::after{content:"";position:absolute;inset:0;opacity:.12;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:26px 26px;mask-image:linear-gradient(120deg,#000,transparent 78%)} .brand-cover__badge{position:absolute!important;z-index:6;left:12px;top:12px;padding:6px 8px!important;border-radius:999px;border:1px solid rgba(255,255,255,.1);background:rgba(3,8,15,.62);color:#d8e9fa;font-size:7px!important;font-weight:850;letter-spacing:.12em!important} .brand-cover__scene{position:absolute;inset:0;z-index:2;overflow:hidden} .brand-cover__hero,.brand-cover__tile{position:absolute;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.02));box-shadow:0 18px 34px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.08)} .brand-cover__hero{left:18px;right:18px;bottom:18px;top:46px;border-radius:22px;overflow:hidden} .brand-cover__tile{width:74px;height:56px;border-radius:18px;backdrop-filter:blur(10px)} .brand-cover__tile--one{right:22px;top:56px;transform:rotate(12deg)} .brand-cover__tile--two{right:48px;top:104px;transform:rotate(-10deg)} .brand-cover__tile--three{left:26px;bottom:28px;width:88px;height:64px;transform:rotate(-12deg)} .brand-cover__logo-chip{position:absolute;right:20px;bottom:20px;width:72px;height:72px;border-radius:22px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.12);background:linear-gradient(145deg,rgba(255,255,255,.14),rgba(255,255,255,.045));box-shadow:0 20px 40px rgba(0,0,0,.42), 0 0 30px color-mix(in srgb,var(--accent) 18%,transparent);backdrop-filter:blur(14px);z-index:4} .brand-cover__logo-chip img{width:40px;height:40px;object-fit:contain;filter:brightness(0) invert(1) drop-shadow(0 8px 16px rgba(0,0,0,.35))} .brand-cover__logo-chip span{display:none;font-size:30px;font-weight:900;color:#fff} .brand-cover__logo-chip.is-fallback span{display:block} .brand-cover__logo-chip.is-fallback img{display:none} /* base hero scenes */ .brand-cover__hero::before,.brand-cover__hero::after,.brand-cover__tile::before{content:"";position:absolute} .brand-cover[data-art="steam"] .brand-cover__hero, .brand-cover[data-art="steam-balance"] .brand-cover__hero{background:radial-gradient(circle at 20% 20%, rgba(100,180,255,.30), transparent 28%), linear-gradient(150deg,#0d2440,#08111d 74%)} .brand-cover[data-art="steam"] .brand-cover__hero::before, .brand-cover[data-art="steam-balance"] .brand-cover__hero::before{left:-20px;bottom:-28px;width:170px;height:170px;border-radius:50%;border:10px solid rgba(255,255,255,.12)} .brand-cover[data-art="steam"] .brand-cover__hero::after, .brand-cover[data-art="steam-balance"] .brand-cover__hero::after{right:18px;top:18px;width:74px;height:74px;border-radius:50%;background:radial-gradient(circle, rgba(255,255,255,.18), transparent 62%);box-shadow:0 0 0 10px rgba(255,255,255,.08)} .brand-cover[data-art^="telegram"] .brand-cover__hero{background:radial-gradient(circle at 26% 24%, rgba(56,198,255,.26), transparent 30%), linear-gradient(150deg,#0b2230,#08111d 76%)} .brand-cover[data-art^="telegram"] .brand-cover__hero::before{left:18px;top:18px;width:90px;height:90px;border-radius:26px;background:linear-gradient(145deg,rgba(255,255,255,.14),rgba(255,255,255,.03));transform:rotate(-10deg)} .brand-cover[data-art^="telegram"] .brand-cover__hero::after{right:-16px;bottom:-10px;width:140px;height:140px;border-radius:50%;background:radial-gradient(circle, rgba(73,182,255,.34), transparent 66%)} .brand-cover[data-art="telegram-stars"] .brand-cover__tile--one::before{left:22px;top:14px;width:30px;height:30px;clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 92%,50% 70%,21% 92%,32% 57%,2% 35%,39% 35%);background:#f9f6dc;filter:drop-shadow(0 0 12px rgba(255,235,120,.45))} .brand-cover[data-art="telegram-premium"], .brand-cover[data-art="telegram-premium-subscription"]{} .brand-cover[data-art="telegram-premium"] .brand-cover__tile--one::before, .brand-cover[data-art="telegram-premium-subscription"] .brand-cover__tile--one::before{left:17px;top:16px;width:38px;height:24px;border-radius:999px;background:linear-gradient(90deg,#8cecff,#fff)} .brand-cover[data-art="apple"] .brand-cover__hero{background:radial-gradient(circle at 28% 24%, rgba(244,248,255,.16), transparent 28%), linear-gradient(150deg,#16191d,#0a0d11 78%)} .brand-cover[data-art="apple"] .brand-cover__hero::before{left:18px;top:20px;width:92px;height:72px;border-radius:20px;background:linear-gradient(145deg,rgba(255,255,255,.15),rgba(255,255,255,.03))} .brand-cover[data-art="apple"] .brand-cover__hero::after{left:42px;top:44px;width:44px;height:20px;border-radius:999px;background:rgba(255,255,255,.12);box-shadow:0 30px 0 rgba(255,255,255,.08), 62px 0 0 rgba(255,255,255,.08), 62px 30px 0 rgba(255,255,255,.06)} .brand-cover[data-art="google-play"] .brand-cover__hero{background:linear-gradient(145deg,#112033,#09111a 78%)} .brand-cover[data-art="google-play"] .brand-cover__hero::before{left:24px;top:28px;width:0;height:0;border-top:34px solid transparent;border-bottom:34px solid transparent;border-left:58px solid rgba(255,255,255,.16);filter:drop-shadow(0 0 18px rgba(85,170,255,.25))} .brand-cover[data-art="spotify"] .brand-cover__hero{background:linear-gradient(145deg,#112219,#08110f 78%)} .brand-cover[data-art="spotify"] .brand-cover__hero::before{left:24px;top:34px;width:110px;height:110px;border-radius:50%;background:radial-gradient(circle at 35% 35%, rgba(38,222,129,.34), transparent 34%), #0f1712} .brand-cover[data-art="spotify"] .brand-cover__hero::after{left:50px;top:72px;width:60px;height:10px;border-radius:999px;background:#fff;box-shadow:0 18px 0 rgba(255,255,255,.88),0 36px 0 rgba(255,255,255,.8)} .brand-cover[data-art="discord"] .brand-cover__hero{background:linear-gradient(145deg,#171b34,#090d1b 78%)} .brand-cover[data-art="discord"] .brand-cover__hero::before{left:26px;top:30px;width:110px;height:80px;border-radius:24px;background:rgba(115,137,218,.20)} .brand-cover[data-art="discord"] .brand-cover__hero::after{left:40px;top:52px;width:82px;height:34px;border-radius:17px;background:#fff;clip-path:polygon(0 0,100% 0,100% 74%,62% 74%,50% 100%,46% 74%,0 74%)} .brand-cover[data-art="netflix"] .brand-cover__hero{background:linear-gradient(145deg,#220b0b,#090b12 78%)} .brand-cover[data-art="netflix"] .brand-cover__hero::before{left:46px;top:20px;width:28px;height:112px;background:#ff4141;box-shadow:38px 0 0 #ff4141;transform:skewX(-18deg)} .brand-cover[data-art="netflix"] .brand-cover__hero::after{left:48px;top:20px;width:28px;height:112px;background:rgba(140,0,0,.75);transform:skewX(18deg)} .brand-cover[data-art="windows"], .brand-cover[data-art="microsoft"]{} .brand-cover[data-art="windows"] .brand-cover__hero, .brand-cover[data-art="microsoft"] .brand-cover__hero{background:linear-gradient(145deg,#102332,#08111a 78%)} .brand-cover[data-art="windows"] .brand-cover__hero::before, .brand-cover[data-art="microsoft"] .brand-cover__hero::before{left:26px;top:26px;width:96px;height:96px;background:linear-gradient(90deg,rgba(255,255,255,.16) 48%,transparent 48%,transparent 52%,rgba(255,255,255,.16) 52%),linear-gradient(rgba(255,255,255,.16) 48%,transparent 48%,transparent 52%,rgba(255,255,255,.16) 52%)} .brand-cover[data-art="playstation"] .brand-cover__hero{background:linear-gradient(145deg,#102058,#08111a 78%)} .brand-cover[data-art="playstation"] .brand-cover__hero::before{left:24px;top:18px;width:104px;height:104px;border-radius:24px;background:radial-gradient(circle at 30% 30%, rgba(80,120,255,.55), transparent 44%)} .brand-cover[data-art="xbox"] .brand-cover__hero{background:linear-gradient(145deg,#0c1d14,#08110d 78%)} .brand-cover[data-art="xbox"] .brand-cover__hero::before{left:26px;top:26px;width:100px;height:100px;border-radius:50%;background:radial-gradient(circle at center, rgba(112,234,126,.24), transparent 56%);box-shadow:0 0 0 8px rgba(112,234,126,.10)} .brand-cover[data-art="amazon"] .brand-cover__hero{background:linear-gradient(145deg,#22190d,#0a0d11 78%)} .brand-cover[data-art="amazon"] .brand-cover__hero::before{left:26px;top:34px;width:106px;height:74px;border-radius:18px;background:rgba(255,255,255,.10)} .brand-cover[data-art="amazon"] .brand-cover__hero::after{left:54px;top:88px;width:70px;height:10px;border-radius:999px;background:#ffb85c;transform:rotate(8deg)} .brand-cover[data-art="yandex"] .brand-cover__hero{background:linear-gradient(145deg,#261a0d,#090b12 78%)} .brand-cover[data-art="yandex"] .brand-cover__hero::before{left:28px;top:26px;width:112px;height:86px;border-radius:24px;background:rgba(255,255,255,.09)} .brand-cover[data-art="battlenet"] .brand-cover__hero{background:linear-gradient(145deg,#0c1630,#090b12 78%)} .brand-cover[data-art="battlenet"] .brand-cover__hero::before{left:24px;top:24px;width:108px;height:108px;border-radius:50%;border:8px solid rgba(84,151,255,.18)} .brand-cover[data-art="battlenet"] .brand-cover__hero::after{left:74px;top:16px;width:8px;height:126px;background:rgba(84,151,255,.18);transform:rotate(35deg)} /* cards should not show repeated text in art area */ .product-card__visual.has-brand-panel .product-card__brand, .subcategory-card .brand-cover__copy, .brand-cover__wordmark{display:none!important} .product-card__visual.has-brand-panel{height:168px!important;padding:10px!important} .product-card__visual.has-brand-panel .brand-cover{border-radius:17px!important} .subcategory-card.has-brand-panel .subcategory-card__visual{padding:10px!important} .subcategory-card.has-brand-panel .brand-cover{border-radius:18px!important} .subcategory-card.has-brand-panel .subcategory-card__supplier{display:none!important} .product-card__visual.has-brand-panel .product-card__cover-mark{right:18px!important;top:18px!important} .subcategory-card:hover .brand-cover__logo-chip,.product-card:hover .brand-cover__logo-chip{transform:translateY(-2px) scale(1.02)} @media(max-width:760px){ .brand-cover__hero{left:14px;right:14px;top:42px;bottom:14px;border-radius:18px} .brand-cover__tile{width:58px;height:44px;border-radius:15px} .brand-cover__logo-chip{width:60px;height:60px;border-radius:18px;right:14px;bottom:14px} .brand-cover__logo-chip img{width:34px;height:34px} .product-card__visual.has-brand-panel{height:148px!important} } /* === v4.7 provider-image service cards === */ .brand-cover{position:relative;width:100%;height:100%;padding:0!important;border-radius:19px!important;overflow:hidden;isolation:isolate;background:linear-gradient(160deg,#08111c,#040912 76%)} .brand-cover__mesh{position:absolute;inset:0;background: radial-gradient(circle at 18% 18%, color-mix(in srgb,var(--accent) 14%,transparent), transparent 28%), radial-gradient(circle at 86% 80%, rgba(255,255,255,.04), transparent 22%), linear-gradient(160deg,#08111c,#040912 76%)} .brand-cover__mesh::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.38));} .brand-cover__badge{position:absolute!important;z-index:5;left:12px;top:12px;padding:6px 8px!important;border-radius:999px;border:1px solid rgba(255,255,255,.10);background:rgba(3,8,15,.62);color:#d8e9fa;font-size:7px!important;font-weight:850;letter-spacing:.12em!important} .brand-cover__scene{position:absolute;inset:0;z-index:2;overflow:hidden} .brand-cover__hero-image{position:absolute;inset:16px 16px 16px 16px;border-radius:20px;display:grid;place-items:center;background:linear-gradient(145deg,rgba(255,255,255,.05),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)} .brand-cover__hero-image img{max-width:78%;max-height:72%;object-fit:contain;filter:drop-shadow(0 18px 26px rgba(0,0,0,.42));transform:scale(1)} .brand-cover__hero-image.is-fallback span{display:block} .brand-cover__hero-image span{display:none;font-size:24px;font-weight:800;letter-spacing:-.03em;color:#fff;text-align:center;padding:0 16px} .brand-cover__glow{position:absolute;inset:auto auto -10px -12px;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 22%,transparent),transparent 68%);filter:blur(10px);opacity:.85} .brand-cover__glass{position:absolute;border:1px solid rgba(255,255,255,.09);background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.02));backdrop-filter:blur(12px);box-shadow:0 16px 30px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.06)} .brand-cover__glass--one{right:18px;top:52px;width:70px;height:48px;border-radius:18px;transform:rotate(9deg)} .brand-cover__glass--two{left:24px;bottom:22px;width:84px;height:58px;border-radius:20px;transform:rotate(-10deg)} .subcategory-card.has-brand-panel .subcategory-card__supplier{display:none!important} .product-card__visual.has-brand-panel .product-card__brand{display:none!important} .product-card__visual.has-brand-panel,.subcategory-card.has-brand-panel .subcategory-card__visual{padding:10px!important} .product-card__visual.has-brand-panel{height:168px!important} .subcategory-card.has-brand-panel .subcategory-card__visual{height:188px!important} .subcategory-card:hover .brand-cover__hero-image img,.product-card:hover .brand-cover__hero-image img{transform:scale(1.035)} @media(max-width:760px){ .brand-cover__hero-image{inset:12px} .brand-cover__hero-image img{max-width:74%;max-height:68%} .brand-cover__glass--one{width:58px;height:40px;top:44px;right:12px} .brand-cover__glass--two{width:68px;height:46px;left:16px;bottom:16px} .product-card__visual.has-brand-panel{height:148px!important} .subcategory-card.has-brand-panel .subcategory-card__visual{height:160px!important} } /* === FAZORA v4.8 — real catalog artwork, no decorative fake scenes === */ .brand-cover{ position:relative!important; width:100%!important; height:100%!important; padding:0!important; overflow:hidden!important; border-radius:18px!important; background:#070b12!important; border:1px solid rgba(255,255,255,.08)!important; } .brand-cover__mesh{ position:absolute!important; inset:0!important; background:radial-gradient(circle at 22% 15%,color-mix(in srgb,var(--accent) 16%,transparent),transparent 34%),#070b12!important; opacity:1!important; } .brand-cover__mesh::after{display:none!important} .brand-cover__badge{ left:12px!important; right:auto!important; top:12px!important; z-index:6!important; background:rgba(2,6,12,.76)!important; backdrop-filter:blur(10px)!important; } .brand-cover__media{ position:absolute; inset:0; z-index:2; display:grid; place-items:center; overflow:hidden; background:#090d14; } .brand-cover__media img{ display:block!important; width:100%!important; height:100%!important; max-width:none!important; max-height:none!important; margin:0!important; padding:0!important; transform:none!important; transition:transform .45s cubic-bezier(.2,.8,.2,1),filter .45s ease!important; } .brand-cover__media--cover img{object-fit:cover!important;object-position:center!important} .brand-cover__media--contain{inset:10px;border-radius:14px;background:linear-gradient(145deg,#f8fafc,#e7ecf3)} .brand-cover__media--contain img{object-fit:contain!important;padding:22px!important;filter:none!important} .brand-cover__media>span{display:none;width:70px;height:70px;border-radius:20px;place-items:center;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);font-size:30px;font-weight:900;color:#fff} .brand-cover__media.is-empty>span{display:grid} .brand-cover__shade{position:absolute;z-index:4;inset:0;background:linear-gradient(180deg,rgba(2,5,10,.02) 48%,rgba(2,5,10,.28));pointer-events:none} .brand-cover[data-art="apple"] .brand-cover__media--contain, .brand-cover[data-art="google-play"] .brand-cover__media--contain, .brand-cover[data-art="microsoft"] .brand-cover__media--contain, .brand-cover[data-art="windows"] .brand-cover__media--contain{background:#fff} .brand-cover[data-art="spotify"] .brand-cover__media--contain{background:#121212} .brand-cover[data-art="spotify"] .brand-cover__media--contain img{filter:none!important} .brand-cover[data-art="netflix"] .brand-cover__media--contain{background:#090909} .brand-cover[data-art="yandex"] .brand-cover__media--contain{background:#fff} .brand-cover[data-art="battlenet"] .brand-cover__media--contain{background:#07162a} .brand-cover[data-art="playstation"] .brand-cover__media--contain{background:linear-gradient(145deg,#0b37a5,#061b58)} .brand-cover[data-art="xbox"] .brand-cover__media--contain{background:linear-gradient(145deg,#0f6b2b,#073719)} .subcategory-card.has-brand-panel .subcategory-card__visual, .product-card__visual.has-brand-panel{ padding:10px!important; background:#050810!important; } .subcategory-card.has-brand-panel .subcategory-card__visual{height:190px!important} .product-card__visual.has-brand-panel{height:170px!important} .subcategory-card.has-brand-panel .subcategory-card__supplier, .product-card__visual.has-brand-panel .product-card__brand{display:none!important} .subcategory-card:hover .brand-cover__media img, .product-card:hover .brand-cover__media img{transform:scale(1.025)!important} @media(max-width:760px){ .subcategory-card.has-brand-panel .subcategory-card__visual{height:158px!important} .product-card__visual.has-brand-panel{height:148px!important} .brand-cover__media--contain img{padding:17px!important} } /* ========================================================================== */ /* FAZORA v4.9 — name-first catalog cards, no external artwork */ /* ========================================================================== */ .product-card__visual.has-brand-panel, .subcategory-card.has-brand-panel .subcategory-card__visual{ padding:10px!important; background:#04070d!important; } .subcategory-card.has-brand-panel .subcategory-card__visual{height:190px!important} .product-card__visual.has-brand-panel{height:172px!important} .product-card__visual.has-brand-panel .product-card__brand, .product-card__visual.has-brand-panel .product-card__cover-mark, .subcategory-card.has-brand-panel .subcategory-card__supplier{display:none!important} .name-cover{ position:relative; width:100%; height:100%; overflow:hidden; isolation:isolate; border-radius:20px; border:1px solid color-mix(in srgb,var(--name-accent) 22%,rgba(255,255,255,.08)); background: radial-gradient(circle at 18% 18%,color-mix(in srgb,var(--name-accent) 34%,transparent),transparent 34%), radial-gradient(circle at 86% 74%,color-mix(in srgb,var(--name-accent-2) 52%,transparent),transparent 40%), linear-gradient(145deg,color-mix(in srgb,var(--name-accent-2) 65%,#07101a),#04070d 74%); box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 18px 45px rgba(0,0,0,.28); } .name-cover::before{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(120deg,rgba(255,255,255,.065),transparent 36%,rgba(255,255,255,.018) 68%,transparent); pointer-events:none; } .name-cover::after{ content:""; position:absolute; z-index:1; inset:auto 9% -1px; height:1px; background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--name-accent) 78%,#fff),transparent); opacity:.8; } .name-cover__noise{ position:absolute; inset:0; z-index:0; opacity:.14; background-image: linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px), linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px); background-size:28px 28px; mask-image:linear-gradient(130deg,#000,transparent 78%); } .name-cover__shape{position:absolute;display:block;pointer-events:none;transition:transform .55s cubic-bezier(.2,.8,.2,1),opacity .55s ease} .name-cover__shape--one{ width:154px;height:154px;right:-28px;top:-52px;border-radius:50%; border:1px solid color-mix(in srgb,var(--name-accent) 38%,rgba(255,255,255,.06)); background:radial-gradient(circle at 34% 34%,color-mix(in srgb,var(--name-accent) 28%,rgba(255,255,255,.08)),transparent 62%); box-shadow:0 0 48px color-mix(in srgb,var(--name-accent) 14%,transparent),inset 0 0 34px rgba(255,255,255,.025); } .name-cover__shape--two{ width:118px;height:54px;right:22px;bottom:22px;border-radius:18px; border:1px solid rgba(255,255,255,.09); background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.018)); backdrop-filter:blur(9px); transform:rotate(-12deg); box-shadow:0 18px 35px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.06); } .name-cover__shape--three{ width:88px;height:88px;left:-22px;bottom:-30px;border-radius:26px; border:1px solid color-mix(in srgb,var(--name-accent) 22%,rgba(255,255,255,.05)); background:linear-gradient(145deg,color-mix(in srgb,var(--name-accent) 15%,rgba(255,255,255,.04)),rgba(255,255,255,.01)); transform:rotate(28deg); } .name-cover__label{ position:absolute; z-index:3; left:18px; top:17px; padding:7px 9px; border:1px solid rgba(255,255,255,.10); border-radius:999px; background:rgba(2,6,12,.48); backdrop-filter:blur(9px); color:color-mix(in srgb,var(--name-accent) 70%,#fff); font-size:8px; line-height:1; font-weight:850; letter-spacing:.14em; } .name-cover__title{ position:absolute; z-index:3; left:18px; right:22px; top:50%; transform:translateY(-42%); max-width:82%; color:#f7fbff; font-size:clamp(25px,2.3vw,40px); line-height:.94; font-weight:900; letter-spacing:-.065em; text-wrap:balance; text-shadow:0 12px 35px rgba(0,0,0,.44); } .name-cover__index{ position:absolute; z-index:3; left:19px; bottom:16px; color:rgba(225,237,250,.46); font-size:7px; font-weight:750; letter-spacing:.16em; } .subcategory-card:hover .name-cover__shape--one, .product-card:hover .name-cover__shape--one{transform:translate(-4px,5px) scale(1.04)} .subcategory-card:hover .name-cover__shape--two, .product-card:hover .name-cover__shape--two{transform:translateY(-4px) rotate(-7deg)} .subcategory-card:hover .name-cover__shape--three, .product-card:hover .name-cover__shape--three{transform:translate(5px,-4px) rotate(34deg)} .subcategory-card:hover .name-cover, .product-card:hover .name-cover{border-color:color-mix(in srgb,var(--name-accent) 40%,rgba(255,255,255,.09))} /* Individual rhythm without icons or images. */ .name-cover[data-art="roblox"],.name-cover[data-art="apple"]{ background:radial-gradient(circle at 18% 18%,rgba(255,255,255,.16),transparent 34%),linear-gradient(145deg,#252b34,#080b10 74%); } .name-cover[data-art="valorant"],.name-cover[data-art="netflix"]{ background:radial-gradient(circle at 18% 18%,color-mix(in srgb,var(--name-accent) 32%,transparent),transparent 32%),linear-gradient(145deg,#351016,#09070b 76%); } .name-cover[data-art="xbox"],.name-cover[data-art="spotify"],.name-cover[data-art="minecraft"]{ background:radial-gradient(circle at 18% 18%,color-mix(in srgb,var(--name-accent) 30%,transparent),transparent 34%),linear-gradient(145deg,#0d2b1a,#050a08 76%); } .name-cover[data-art="pubg"],.name-cover[data-art="free-fire"],.name-cover[data-art="amazon"],.name-cover[data-art="yandex"]{ background:radial-gradient(circle at 18% 18%,color-mix(in srgb,var(--name-accent) 30%,transparent),transparent 34%),linear-gradient(145deg,#35210e,#090805 76%); } .name-cover[data-art="telegram-stars"] .name-cover__shape--one{border-radius:32px;transform:rotate(18deg)} .name-cover[data-art="telegram-stars"] .name-cover__shape--two{border-radius:50%;width:78px;height:78px} .name-cover[data-art="elden-ring"] .name-cover__shape--one{background:transparent;border-width:2px} .name-cover[data-art="steam"] .name-cover__shape--two, .name-cover[data-art="steam-balance"] .name-cover__shape--two, .name-cover[data-art="steam-games"] .name-cover__shape--two{width:142px;height:42px;border-radius:999px;transform:rotate(-9deg)} .name-cover[data-art="playstation"] .name-cover__shape--three, .name-cover[data-art="mlbb"] .name-cover__shape--three{border-radius:50%;transform:rotate(0deg)} .name-cover[data-art="discord"] .name-cover__shape--two{width:126px;height:62px;border-radius:28px} /* Subcategory information is no longer duplicated under the official name. */ .subcategory-card__body{min-height:92px!important;padding-top:19px!important} .subcategory-card__body small{margin-bottom:10px!important} .subcategory-card__body p{margin:0!important;max-width:90%;font-size:12px!important;line-height:1.55!important;color:#8295aa!important} .subcategory-card__footer{margin-top:auto!important} /* Product search results retain specific SKU names below the brand panel. */ .product-card__visual.has-brand-panel+.product-card__body{padding-top:17px!important} /* Configurator uses the same typography-first art language. */ .service-configurator__cover--name{padding:20px!important;display:block!important;min-height:300px;background:linear-gradient(145deg,#07101a,#03070d)!important} .service-configurator__cover--name::before{display:none!important} .service-configurator__cover--name .name-cover{height:100%;min-height:260px;border-radius:26px} .service-configurator__cover--name .name-cover__title{font-size:clamp(38px,5vw,68px);max-width:76%;left:30px;right:30px} .service-configurator__cover--name .name-cover__label{left:30px;top:28px} .service-configurator__cover--name .name-cover__index{left:31px;bottom:28px} @media(max-width:760px){ .subcategory-card.has-brand-panel .subcategory-card__visual{height:162px!important} .product-card__visual.has-brand-panel{height:150px!important} .name-cover{border-radius:17px} .name-cover__title{font-size:26px;max-width:84%;left:15px;right:15px} .name-cover__label{left:15px;top:14px;font-size:7px} .name-cover__index{left:16px;bottom:13px} .name-cover__shape--one{width:122px;height:122px;right:-34px;top:-40px} .name-cover__shape--two{width:88px;height:42px;right:14px;bottom:16px} .name-cover__shape--three{width:66px;height:66px} .subcategory-card__body{min-height:80px!important} .service-configurator__cover--name{min-height:220px;padding:14px!important} .service-configurator__cover--name .name-cover{min-height:190px;border-radius:20px} .service-configurator__cover--name .name-cover__title{font-size:36px;left:22px;right:22px} .service-configurator__cover--name .name-cover__label{left:22px;top:21px} .service-configurator__cover--name .name-cover__index{left:23px;bottom:21px} } /* ========================================================================== */ /* FAZORA v5.1 — final purchase information block */ /* ========================================================================== */ .store-confidence{position:relative;margin-top:112px;margin-bottom:112px;padding:0;border-top:1px solid rgba(255,255,255,.075);border-bottom:1px solid rgba(255,255,255,.075);overflow:hidden} .store-confidence::before{content:"";position:absolute;right:-120px;top:-180px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(60,139,235,.11),transparent 68%);pointer-events:none} .store-confidence__head{position:relative;display:grid;grid-template-columns:minmax(0,.9fr) minmax(360px,.7fr);gap:70px;align-items:end;padding:48px 4px 35px} .store-confidence__head span{color:#6687a8;font-size:9px;font-weight:850;letter-spacing:.16em} .store-confidence__head h2{margin:11px 0 0;font-size:clamp(34px,4vw,56px);line-height:1;letter-spacing:-.055em;color:#f6faff} .store-confidence__head p{margin:0;color:#7c91a7;font-size:13px;line-height:1.75} .store-confidence__grid{position:relative;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.065)} .store-confidence__grid article{position:relative;min-height:188px;padding:30px 30px 28px;display:grid;grid-template-columns:40px 1fr;gap:18px;border-right:1px solid rgba(255,255,255,.065);transition:background .28s ease,transform .28s ease} .store-confidence__grid article:last-child{border-right:0} .store-confidence__grid article:hover{background:linear-gradient(145deg,rgba(49,117,203,.075),rgba(255,255,255,.012));transform:translateY(-3px)} .store-confidence__grid b{width:34px;height:34px;border:1px solid rgba(116,183,255,.15);border-radius:11px;display:grid;place-items:center;background:rgba(94,162,239,.055);color:#91c8ff;font-size:9px;letter-spacing:.08em} .store-confidence__grid strong{display:block;font-size:16px;letter-spacing:-.025em;color:#edf6ff} .store-confidence__grid p{margin:11px 0 0;color:#71869c;font-size:11px;line-height:1.65} @media(max-width:900px){.store-confidence__head{grid-template-columns:1fr;gap:18px}.store-confidence__grid{grid-template-columns:1fr}.store-confidence__grid article{min-height:0;border-right:0;border-bottom:1px solid rgba(255,255,255,.065)}.store-confidence__grid article:last-child{border-bottom:0}} @media(max-width:760px){.store-confidence{margin-top:76px;margin-bottom:76px}.store-confidence__head{padding:34px 2px 25px}.store-confidence__head h2{font-size:36px}.store-confidence__head p{font-size:12px}.store-confidence__grid article{padding:24px 2px;grid-template-columns:36px 1fr}} /* ========================================================================== */ /* FAZORA v5.2 — final brand mark and simplified information section */ /* ========================================================================== */ .brand--new{display:inline-flex;align-items:center;gap:11px;text-decoration:none} .brand__mark{position:relative;width:38px;height:38px;flex:0 0 38px;border:1px solid rgba(148,201,255,.16);border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,#112a43,#07111d);box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 12px 30px rgba(0,0,0,.28),0 0 28px rgba(65,145,235,.10);overflow:hidden} .brand__mark b{position:relative;z-index:2;font-size:17px;font-weight:900;letter-spacing:-.08em;color:#f5faff} .brand__mark i{position:absolute;width:52px;height:18px;border:1px solid rgba(133,193,255,.26);border-radius:50%;transform:rotate(-24deg);box-shadow:0 0 14px rgba(84,161,246,.10)} .brand__name{font-size:20px;font-weight:850;letter-spacing:.105em;color:#f5f8fc} .brand--new:hover .brand__mark{border-color:rgba(148,201,255,.28);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 14px 34px rgba(0,0,0,.32),0 0 34px rgba(65,145,235,.17)} .search-launch{justify-content:flex-start!important} .search-launch span{flex:1;text-align:left} .store-confidence__head>div>span{display:none!important} .store-confidence__head{align-items:center} .store-confidence__head h2{margin:0} .store-confidence__grid article{grid-template-columns:42px 1fr} @media(max-width:760px){.brand__mark{width:34px;height:34px;flex-basis:34px;border-radius:11px}.brand__name{font-size:17px}.store-confidence__grid article{grid-template-columns:36px 1fr}} /* ========================================================================== */ /* FAZORA v5.3 — Saturn identity, category icons and smoother interaction */ /* ========================================================================== */ :root{--fz-ease:cubic-bezier(.22,.82,.24,1);--fz-ease-soft:cubic-bezier(.16,1,.3,1)} .brand--new,.mobile-menu .brand{gap:12px} .brand__mark{display:none!important} .brand__saturn{position:relative;width:48px;height:38px;flex:0 0 48px;display:grid;place-items:center;filter:drop-shadow(0 10px 22px rgba(35,111,201,.28));transition:transform .65s var(--fz-ease-soft),filter .65s ease} .brand__saturn-planet{position:absolute;width:25px;height:25px;border-radius:50%;background:radial-gradient(circle at 31% 25%,#f7fbff 0,#aacbea 18%,#4b79a8 49%,#102b49 74%,#020711 100%);box-shadow:inset -5px -6px 12px rgba(0,0,0,.35),0 0 20px rgba(81,160,246,.26);z-index:2} .brand__saturn-ring{position:absolute;width:47px;height:16px;border:2px solid rgba(171,216,255,.84);border-left-color:rgba(78,155,241,.18);border-right-color:rgba(78,155,241,.25);border-radius:50%;transform:rotate(-17deg);box-shadow:0 0 11px rgba(85,164,250,.25);z-index:3} .brand__saturn-ring::after{content:"";position:absolute;inset:3px -4px;border:1px solid rgba(102,174,255,.24);border-radius:50%} .brand__saturn-star{position:absolute;right:1px;top:3px;width:3px;height:3px;border-radius:50%;background:#fff;box-shadow:0 0 9px #9ed2ff} .brand__name{font-size:20px;font-weight:850;letter-spacing:.115em;color:#f6faff;transition:letter-spacing .55s var(--fz-ease-soft),color .45s ease} .brand:hover .brand__saturn{transform:translateY(-1px) rotate(4deg) scale(1.035);filter:drop-shadow(0 13px 27px rgba(52,135,229,.4))} .brand:hover .brand__name{letter-spacing:.14em;color:#fff} .intro__portal{display:none!important} .intro__saturn{position:absolute;width:250px;height:210px;display:grid;place-items:center;opacity:0;animation:introSaturn 2.15s var(--fz-ease-soft) both} .intro__saturn-planet{position:absolute;width:98px;height:98px;border-radius:50%;background:radial-gradient(circle at 30% 24%,#fff,#9fc3e7 20%,#426f9d 52%,#102943 76%,#01050a);box-shadow:0 0 65px rgba(57,139,232,.38),inset -16px -20px 25px rgba(0,0,0,.42);z-index:2} .intro__saturn-ring{position:absolute;width:224px;height:68px;border:5px solid rgba(191,224,255,.77);border-left-color:rgba(73,148,231,.12);border-right-color:rgba(73,148,231,.22);border-radius:50%;transform:rotate(-17deg);box-shadow:0 0 34px rgba(89,166,251,.24);z-index:3} .intro__saturn-glow{position:absolute;width:180px;height:180px;border-radius:50%;background:rgba(50,132,231,.34);filter:blur(55px)} @keyframes introSaturn{0%,16%{opacity:0;transform:scale(.2) rotate(-18deg);filter:blur(12px)}38%,70%{opacity:1;transform:scale(1) rotate(0);filter:none}100%{opacity:0;transform:scale(2.6) rotate(8deg);filter:blur(8px)}} .catalog-pill>i{width:48px!important;height:48px!important;border-radius:16px!important;display:grid!important;place-items:center!important;background:linear-gradient(145deg,color-mix(in srgb,var(--category-accent) 15%,#0a1420),#050a10)!important;border:1px solid color-mix(in srgb,var(--category-accent) 22%,rgba(255,255,255,.06))!important;color:color-mix(in srgb,var(--category-accent) 78%,#fff)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 14px 28px rgba(0,0,0,.18)!important;transition:transform .62s var(--fz-ease-soft),background .55s ease,color .55s ease,box-shadow .55s ease!important} .catalog-pill>i svg{width:23px;height:23px;stroke:currentColor;stroke-width:1.55;transition:transform .65s var(--fz-ease-soft)} .catalog-pill:hover>i,.catalog-pill.active>i{transform:translateY(-3px) scale(1.055);background:linear-gradient(145deg,color-mix(in srgb,var(--category-accent) 25%,#0d1a2a),#07101a)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 18px 38px color-mix(in srgb,var(--category-accent) 12%,rgba(0,0,0,.25))!important} .catalog-pill:hover>i svg,.catalog-pill.active>i svg{transform:scale(1.08) rotate(-3deg)} /* Deliberately slower, quieter interaction rhythm. */ .topbar,.search-launch,.hero-categories button,.catalog-pill,.subcategory-card,.product-card,.catalog-back,.catalog-toolbar button,.catalog-toolbar select,.drawer__panel,.product-modal__card,.mobile-menu,.overlay-close,.search-result,.store-confidence__grid article{transition-duration:.46s!important;transition-timing-function:var(--fz-ease-soft)!important} .reveal{transition-duration:1.05s!important;transition-timing-function:var(--fz-ease-soft)!important} .subcategory-card:hover,.product-card:hover{transform:translateY(-5px)!important} .drawer.open .drawer__panel,.product-modal.open .product-modal__card,.mobile-menu.open{animation:fzSurfaceIn .58s var(--fz-ease-soft) both} @keyframes fzSurfaceIn{from{opacity:0;transform:translateY(18px) scale(.982);filter:blur(5px)}to{opacity:1;transform:none;filter:none}} @media(max-width:760px){.brand__saturn{width:43px;height:34px;flex-basis:43px}.brand__saturn-planet{width:22px;height:22px}.brand__saturn-ring{width:42px;height:14px}.brand__name{font-size:17px}.catalog-pill>i{width:43px!important;height:43px!important;border-radius:14px!important}.catalog-pill>i svg{width:21px;height:21px}} /* === v5.7 purchase control section === */ .store-confidence__icon{ width:38px; height:38px; border:1px solid rgba(116,183,255,.17); border-radius:12px; display:grid; place-items:center; background:linear-gradient(145deg,rgba(94,162,239,.09),rgba(94,162,239,.025)); color:#91c8ff; box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 12px 28px rgba(0,0,0,.14); } .store-confidence__icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round} .store-confidence__grid article{grid-template-columns:42px 1fr!important} .store-confidence__grid article>div{padding-top:1px} @media(max-width:760px){.store-confidence__icon{width:34px;height:34px;border-radius:11px}.store-confidence__icon svg{width:17px;height:17px}.store-confidence__grid article{grid-template-columns:36px 1fr!important}} /* === v5.8 FazerCards live catalog states === */ .provider-loading{width:100%;min-height:360px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border:1px solid rgba(126,174,235,.14);border-radius:22px;background:linear-gradient(145deg,rgba(13,24,39,.92),rgba(6,12,21,.96));box-shadow:0 28px 70px rgba(0,0,0,.28)} .provider-loading span{width:52px;height:52px;border-radius:50%;border:2px solid rgba(116,175,255,.18);border-top-color:#6aaeff;animation:providerSpin .85s linear infinite;margin-bottom:20px} .provider-loading strong{font-size:20px;color:#f5f9ff} .provider-loading p{max-width:430px;margin:9px 0 0;color:#8fa2b8;line-height:1.55} .provider-error button{margin-top:18px;min-height:46px;padding:0 20px;border:1px solid rgba(90,160,255,.38);border-radius:13px;background:rgba(53,126,224,.14);color:#edf6ff;font-weight:750;cursor:pointer} .provider-error button:hover{background:rgba(53,126,224,.24);transform:translateY(-1px)} @keyframes providerSpin{to{transform:rotate(360deg)}} /* === v5.9 live catalog scale and provider status === */ .catalog-provider-status{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:14px 0 18px;padding:14px 16px;border-radius:14px;border:1px solid rgba(92,155,255,.18);background:rgba(10,23,39,.72);box-shadow:inset 0 1px 0 rgba(255,255,255,.035)} .catalog-provider-status[hidden]{display:none} .catalog-provider-status strong{font-size:13px;color:#f5f9ff;white-space:nowrap} .catalog-provider-status span{font-size:12px;line-height:1.5;color:#9fb4cb;text-align:right} .catalog-provider-status.is-live{border-color:rgba(55,201,143,.24);background:linear-gradient(135deg,rgba(15,45,39,.72),rgba(7,21,34,.84))} .catalog-provider-status.is-live strong{color:#a7f4d3} .catalog-provider-status.is-warning{border-color:rgba(240,173,53,.28);background:linear-gradient(135deg,rgba(59,40,13,.72),rgba(12,19,31,.84))} .catalog-provider-status.is-warning strong{color:#ffd58a} .catalog-subcategory-more{display:flex;justify-content:center;padding-top:22px} .catalog-subcategory-more button{min-width:210px;height:48px;border-radius:14px;border:1px solid rgba(112,169,255,.22);background:linear-gradient(180deg,rgba(27,49,78,.92),rgba(13,27,47,.92));color:#edf6ff;font-weight:800;cursor:pointer;transition:transform .3s cubic-bezier(.2,.8,.2,1),border-color .3s ease,box-shadow .3s ease} .catalog-subcategory-more button:hover{transform:translateY(-2px);border-color:rgba(112,169,255,.48);box-shadow:0 14px 30px rgba(0,0,0,.22)} .catalog-pill b{min-width:44px;text-align:right;font-variant-numeric:tabular-nums} @media(max-width:720px){.catalog-provider-status{align-items:flex-start;flex-direction:column}.catalog-provider-status span{text-align:left}.catalog-subcategory-more button{width:100%}} /* === v6.1 operator finance dashboard === */ .operator-shell{max-width:1500px;margin:0 auto;padding:34px 0 70px} .operator-tabs{display:flex;gap:8px;margin-bottom:22px;padding:6px;width:max-content;border:1px solid rgba(255,255,255,.08);border-radius:15px;background:rgba(8,15,25,.78);box-shadow:0 18px 50px rgba(0,0,0,.24)} .operator-tabs button{min-width:130px;height:42px;border:0;border-radius:11px;background:transparent;color:#8494a8;font:800 10px/1 inherit;letter-spacing:.04em;cursor:pointer;transition:.28s ease} .operator-tabs button span{display:inline-grid;place-items:center;min-width:19px;height:19px;margin-left:7px;border-radius:7px;background:rgba(255,255,255,.06);font-size:9px} .operator-tabs button.active{background:#eaf4ff;color:#07111d;box-shadow:0 10px 26px rgba(83,157,255,.20)} .finance-dashboard{display:grid;gap:18px} .finance-head{display:flex;justify-content:space-between;align-items:flex-end;padding:30px 32px;border:1px solid rgba(255,255,255,.08);border-radius:24px;background:linear-gradient(135deg,rgba(15,28,45,.94),rgba(5,11,19,.96));box-shadow:0 28px 80px rgba(0,0,0,.30)} .finance-head span,.finance-panel>span,.finance-history>div>span{color:#6f8298;font-size:8px;font-weight:850;letter-spacing:.15em} .finance-head h1{margin:10px 0 8px;font-size:42px;letter-spacing:-.045em} .finance-head p{max-width:720px;margin:0;color:#8696aa;font-size:10px;line-height:1.75} .operator-refresh{height:42px;padding:0 18px;border:1px solid rgba(255,255,255,.09);border-radius:12px;background:rgba(255,255,255,.04);color:#dbe9f8;font-weight:800;cursor:pointer} .finance-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px} .finance-metric{min-height:154px;padding:22px;border:1px solid rgba(255,255,255,.075);border-radius:20px;background:linear-gradient(155deg,rgba(17,29,45,.96),rgba(6,12,21,.98));box-shadow:0 20px 45px rgba(0,0,0,.20)} .finance-metric span{display:block;color:#6f8298;font-size:8px;font-weight:850;letter-spacing:.10em;text-transform:uppercase} .finance-metric strong{display:block;margin-top:26px;color:#f5f9ff;font-size:28px;letter-spacing:-.04em} .finance-metric small{display:block;margin-top:11px;color:#718299;font-size:8px;line-height:1.45} .finance-metric.primary{border-color:rgba(92,168,255,.26);background:linear-gradient(145deg,rgba(24,55,91,.95),rgba(7,18,31,.98))} .finance-metric.positive strong{color:#8df0bf}.finance-metric.negative strong{color:#ff9f9f} .finance-panels{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:12px} .finance-panel,.finance-history{padding:25px;border:1px solid rgba(255,255,255,.075);border-radius:21px;background:rgba(7,14,24,.90)} .finance-panel h2,.finance-history h2{margin:9px 0 20px;font-size:22px;letter-spacing:-.03em} .finance-rule{display:grid;grid-template-columns:1fr auto;gap:5px 16px;padding:14px 0;border-top:1px solid rgba(255,255,255,.065)} .finance-rule b,.finance-line span{color:#b7c4d4;font-size:9px}.finance-rule strong,.finance-line strong{font-size:14px;color:#f5f9ff}.finance-rule small{grid-column:1/-1;color:#64768b;font-size:8px} .finance-line{display:flex;justify-content:space-between;align-items:center;padding:13px 0;border-top:1px solid rgba(255,255,255,.065)} .finance-history{margin-top:0}.finance-history p{color:#728399;font-size:10px} .finance-history-list{display:grid;gap:1px;border:1px solid rgba(255,255,255,.06);border-radius:14px;overflow:hidden} .finance-history-list>div{display:grid;grid-template-columns:130px 1fr 150px 150px;gap:18px;align-items:center;padding:13px 15px;background:rgba(255,255,255,.025);font-size:9px} .finance-history-list time,.finance-history-list span{color:#73859b}.finance-history-list strong{color:#f3f8ff}.finance-history-list b{color:#8df0bf;text-align:right} .operator-layout{display:grid;grid-template-columns:330px minmax(0,1fr);min-height:650px;border:1px solid rgba(255,255,255,.08);border-radius:22px;overflow:hidden;background:rgba(6,12,21,.92)} .operator-list{padding:10px;border-right:1px solid rgba(255,255,255,.07);overflow:auto} .operator-conversation{display:block;width:100%;padding:16px;border:0;border-radius:14px;background:transparent;color:#e7f0fb;text-align:left;cursor:pointer;transition:.25s ease} .operator-conversation:hover,.operator-conversation.active{background:rgba(75,145,230,.12)} .operator-conversation p{margin:7px 0;color:#718399;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .operator-conversation small{color:#52657a;font-size:8px}.operator-empty-list{padding:25px;color:#6e8095;font-size:10px} .operator-chat{display:flex;flex-direction:column;min-width:0}.chat-head{padding:20px;border-bottom:1px solid rgba(255,255,255,.07)} .chat-head>div{display:flex;align-items:center;gap:12px}.chat-head small{display:block;color:#6e8095;font-size:8px;margin-top:4px} .chat-messages{flex:1;overflow:auto;padding:22px}.chat-message{max-width:70%;margin:8px 0;padding:13px 15px;border-radius:15px;background:rgba(255,255,255,.06);font-size:10px;line-height:1.55}.chat-message.operator{margin-left:auto;background:rgba(64,139,230,.18)}.chat-message time{display:block;margin-top:6px;color:#66788e;font-size:7px} .chat-form{display:grid;grid-template-columns:1fr 48px;gap:8px;padding:15px;border-top:1px solid rgba(255,255,255,.07)}.chat-form input{height:46px;padding:0 15px;border:1px solid rgba(255,255,255,.08);border-radius:13px;background:#08111d;color:#fff}.chat-form button{border:0;border-radius:13px;background:#e8f3ff;color:#07111d;font-size:18px;font-weight:900} @media(max-width:1100px){.finance-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.finance-panels{grid-template-columns:1fr}.operator-layout{grid-template-columns:260px 1fr}} @media(max-width:720px){.operator-shell{padding-top:18px}.finance-head{align-items:flex-start;flex-direction:column;gap:18px;padding:22px}.finance-head h1{font-size:34px}.finance-grid{grid-template-columns:1fr}.operator-layout{grid-template-columns:1fr}.operator-list{max-height:240px;border-right:0;border-bottom:1px solid rgba(255,255,255,.07)}.finance-history-list>div{grid-template-columns:1fr 1fr}.finance-history-list strong,.finance-history-list b{text-align:left}} /* === v6.2 FazerCards API imagery === */ .provider-cover{ position:relative; width:100%; height:100%; min-height:inherit; overflow:hidden; border-radius:20px; background:#07101a; border:1px solid rgba(255,255,255,.08); isolation:isolate; } .provider-cover>img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; transition:transform .75s cubic-bezier(.2,.8,.2,1),filter .45s ease; } .provider-cover__shade{ position:absolute; inset:0; z-index:2; pointer-events:none; background:linear-gradient(180deg,rgba(2,6,12,.02) 38%,rgba(2,6,12,.58) 100%); } .provider-cover__source{ position:absolute; z-index:3; left:12px; bottom:11px; padding:5px 8px; border-radius:8px; border:1px solid rgba(255,255,255,.12); background:rgba(2,7,14,.58); backdrop-filter:blur(10px); color:rgba(255,255,255,.82); font-size:8px; line-height:1; font-weight:800; letter-spacing:.1em; text-transform:uppercase; } .provider-cover__fallback{display:none;position:absolute;inset:0;z-index:1} .provider-cover.is-error .provider-cover__fallback{display:block} .provider-cover.is-error .provider-cover__shade, .provider-cover.is-error .provider-cover__source{display:none} .provider-cover__fallback>.name-cover{height:100%} .subcategory-card:hover .provider-cover>img, .product-card:hover .provider-cover>img{transform:scale(1.045)} .subcategory-card__visual:has(.provider-cover), .product-card__visual:has(.provider-cover){padding:10px!important} .subcategory-card__visual:has(.provider-cover){height:190px!important} .product-card__visual:has(.provider-cover){height:172px!important} .product-card__visual:has(.provider-cover) .product-card__brand{display:none!important} .product-card__visual:has(.provider-cover) .product-card__cover-mark{display:none!important} .service-configurator__cover--name:has(.provider-cover){padding:18px!important} .service-configurator__cover--name .provider-cover{min-height:264px;border-radius:26px} .service-configurator__cover--name .provider-cover__source{left:18px;bottom:17px} .drawer-item__art img,.modal-cover-image{object-fit:cover;object-position:center} @media(max-width:760px){ .subcategory-card__visual:has(.provider-cover){height:162px!important} .product-card__visual:has(.provider-cover){height:150px!important} .provider-cover{border-radius:17px} .service-configurator__cover--name:has(.provider-cover){padding:14px!important} .service-configurator__cover--name .provider-cover{min-height:194px;border-radius:20px} } /* === v6.3 private control === */ .admin-private-page{min-height:100vh;background:#030812;color:#eef6ff} .admin-private-shell{position:relative;z-index:2;min-height:100vh;padding:36px clamp(18px,4vw,62px)} .admin-auth-card{width:min(460px,100%);margin:8vh auto 0;padding:42px;border:1px solid rgba(255,255,255,.09);border-radius:28px;background:linear-gradient(155deg,rgba(12,22,37,.96),rgba(4,10,19,.98));box-shadow:0 40px 110px rgba(0,0,0,.55),inset 0 1px rgba(255,255,255,.05)} .admin-auth-mark{position:relative;width:62px;height:62px;margin-bottom:28px;border:1px solid rgba(114,177,255,.28);border-radius:50%;background:radial-gradient(circle at 36% 30%,#8bc5ff,#1e5c9c 45%,#081626 72%);box-shadow:0 0 55px rgba(67,145,236,.24)} .admin-auth-mark i{position:absolute;inset:27px -12px;border:2px solid rgba(187,222,255,.74);border-radius:50%;transform:rotate(-17deg)} .admin-auth-mark span{position:absolute;inset:8px;border:1px solid rgba(255,255,255,.08);border-radius:50%} .admin-auth-label{margin:0 0 8px;color:#6785a7;font:800 9px/1.2 inherit;letter-spacing:.22em} .admin-auth-card h1{margin:0;font-size:54px;letter-spacing:-.055em} .admin-auth-copy{max-width:360px;margin:14px 0 30px;color:#7890aa;font-size:11px;line-height:1.65} .admin-auth-field{display:block;margin-top:15px} .admin-auth-field span{display:block;margin:0 0 8px;color:#91a6bd;font-size:9px;font-weight:800} .admin-auth-field input{width:100%;height:54px;padding:0 16px;border:1px solid rgba(255,255,255,.09);border-radius:14px;outline:0;background:#07111d;color:#eef7ff;font:700 14px/1 inherit;transition:border-color .25s ease,box-shadow .25s ease} .admin-auth-field input:focus{border-color:rgba(90,161,245,.7);box-shadow:0 0 0 4px rgba(68,142,229,.11)} .admin-auth-submit{width:100%;height:54px;margin-top:20px;border:0;border-radius:14px;background:#eaf5ff;color:#06111e;font-weight:900;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease} .admin-auth-submit:hover{transform:translateY(-1px);box-shadow:0 16px 34px rgba(77,150,233,.2)} .admin-control-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:24px;max-width:1500px;margin:0 auto 22px;padding:14px 16px;border:1px solid rgba(255,255,255,.08);border-radius:20px;background:rgba(6,13,23,.88);backdrop-filter:blur(20px);box-shadow:0 18px 55px rgba(0,0,0,.3)} .admin-control-brand{display:flex;align-items:center;gap:12px;padding-right:12px} .admin-control-brand>i{position:relative;width:34px;height:34px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#9bd0ff,#285f99 48%,#081421 75%);box-shadow:0 0 28px rgba(66,143,232,.25)} .admin-control-brand>i:after{content:"";position:absolute;inset:15px -7px;border:1px solid rgba(196,226,255,.75);border-radius:50%;transform:rotate(-16deg)} .admin-control-brand strong,.admin-control-brand span{display:block}.admin-control-brand strong{font-size:14px}.admin-control-brand span{margin-top:3px;color:#607991;font-size:7px;letter-spacing:.17em} .admin-control-head .operator-tabs{margin:0;justify-self:center} .admin-logout{height:40px;padding:0 16px;border:1px solid rgba(255,255,255,.08);border-radius:11px;background:rgba(255,255,255,.035);color:#9aacc0;font-weight:800;cursor:pointer} .admin-security-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:18px 0} .admin-security-grid article{padding:24px;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:rgba(7,15,26,.85)} .admin-security-grid span{display:block;color:#627b95;font-size:8px;font-weight:850;letter-spacing:.13em;text-transform:uppercase}.admin-security-grid strong{display:block;margin:9px 0;font-size:24px}.admin-security-grid p{margin:0;color:#71869d;font-size:10px;line-height:1.55} .admin-session-list>div{display:grid;grid-template-columns:1.2fr 1fr 1fr auto;align-items:center;gap:18px;padding:15px 0;border-top:1px solid rgba(255,255,255,.07)} .admin-session-list strong,.admin-session-list small{display:block}.admin-session-list small,.admin-session-list span{color:#657b92;font-size:9px}.admin-session-list b{color:#73dca6;font-size:8px;letter-spacing:.1em} .admin-audit-list{display:grid;gap:9px} .admin-audit-list article{display:grid;grid-template-columns:minmax(240px,1fr) 180px 150px;align-items:center;gap:16px;padding:16px 18px;border:1px solid rgba(255,255,255,.07);border-radius:14px;background:rgba(7,15,26,.8)} .admin-audit-list strong,.admin-audit-list small{display:block}.admin-audit-list strong{font-size:11px}.admin-audit-list small,.admin-audit-list span,.admin-audit-list code{margin-top:5px;color:#657b92;font-size:8px}.admin-audit-list code{font-family:ui-monospace,monospace} @media(max-width:900px){.admin-control-head{grid-template-columns:1fr auto}.admin-control-head .operator-tabs{grid-column:1/-1;justify-self:stretch;width:100%;overflow:auto}.admin-control-brand{min-width:0}.admin-security-grid{grid-template-columns:1fr}.admin-session-list>div,.admin-audit-list article{grid-template-columns:1fr}.admin-auth-card{padding:28px}.admin-auth-card h1{font-size:44px}} /* === v6.4 full private control center === */ .admin-private-page{margin:0;background:#030812!important;color:#edf5ff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif} .admin-private-page .ambient{position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 12% 8%,rgba(39,111,197,.13),transparent 28%),radial-gradient(circle at 88% 82%,rgba(52,112,190,.08),transparent 30%)} .admin-private-shell{padding:0!important} .admin-console{position:relative;z-index:2;display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh} .admin-sidebar{position:sticky;top:0;display:flex;flex-direction:column;height:100vh;padding:22px 16px 18px;border-right:1px solid rgba(255,255,255,.07);background:rgba(3,8,16,.94);backdrop-filter:blur(24px)} .admin-sidebar-brand{display:flex;align-items:center;gap:12px;padding:5px 10px 24px;border-bottom:1px solid rgba(255,255,255,.065)} .admin-sidebar-brand>i{position:relative;width:38px;height:38px;flex:0 0 auto;border-radius:50%;background:radial-gradient(circle at 35% 28%,#b7dcff,#3f79b8 42%,#07111d 73%);box-shadow:0 0 28px rgba(67,145,235,.22)} .admin-sidebar-brand>i:after{content:"";position:absolute;inset:16px -8px;border:1px solid rgba(215,235,255,.7);border-radius:50%;transform:rotate(-16deg)} .admin-sidebar-brand strong,.admin-sidebar-brand span{display:block}.admin-sidebar-brand strong{font-size:15px;letter-spacing:.02em}.admin-sidebar-brand span{margin-top:4px;color:#587087;font-size:7px;font-weight:800;letter-spacing:.17em} .admin-sidebar nav{display:grid;gap:4px;margin-top:20px} .admin-sidebar nav button{display:grid;grid-template-columns:30px 1fr auto;align-items:center;width:100%;min-height:44px;padding:0 12px;border:1px solid transparent;border-radius:12px;background:transparent;color:#73859a;text-align:left;font:700 10px/1 inherit;cursor:pointer;transition:.25s cubic-bezier(.22,.8,.28,1)} .admin-sidebar nav button i{display:grid;place-items:center;width:25px;height:25px;border-radius:8px;background:rgba(255,255,255,.035);color:#7d91a8;font-style:normal;font-size:13px} .admin-sidebar nav button:hover{background:rgba(255,255,255,.035);color:#c8d7e7}.admin-sidebar nav button.active{border-color:rgba(91,162,244,.2);background:linear-gradient(90deg,rgba(59,127,210,.18),rgba(27,68,116,.06));color:#f0f7ff;box-shadow:inset 3px 0 0 #64a9f5} .admin-sidebar nav button.active i{background:rgba(85,155,238,.18);color:#a9d3ff}.admin-sidebar nav button b{display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:7px;background:#eaf4ff;color:#07111c;font-size:8px} .admin-sidebar-foot{margin-top:auto;padding:16px 10px 0;border-top:1px solid rgba(255,255,255,.065)} .admin-sidebar-foot div span,.admin-sidebar-foot div strong{display:block}.admin-sidebar-foot div span{color:#53687d;font-size:7px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.admin-sidebar-foot div strong{margin-top:6px;color:#97a9bc;font-size:8px}.admin-sidebar-foot button{width:100%;height:38px;margin-top:15px;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:rgba(255,255,255,.025);color:#8ea0b3;font-weight:800;cursor:pointer} .admin-main{min-width:0}.admin-topbar{position:sticky;top:0;z-index:30;display:flex;justify-content:space-between;align-items:center;height:66px;padding:0 28px;border-bottom:1px solid rgba(255,255,255,.065);background:rgba(4,10,18,.82);backdrop-filter:blur(24px)} .admin-topbar>div{display:flex;align-items:center;gap:10px}.admin-topbar strong,.admin-topbar time{color:#7f92a7;font-size:8px}.admin-topbar button{height:34px;padding:0 13px;border:1px solid rgba(255,255,255,.075);border-radius:9px;background:rgba(255,255,255,.03);color:#aab9c8;font-size:8px;font-weight:800;cursor:pointer}.admin-live-dot{width:7px;height:7px;border-radius:50%;background:#65e5a6;box-shadow:0 0 15px rgba(101,229,166,.75)} .admin-content{max-width:1580px;margin:0 auto;padding:28px 30px 70px} .admin-page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:22px;margin-bottom:20px;padding:28px 30px;border:1px solid rgba(255,255,255,.075);border-radius:22px;background:linear-gradient(135deg,rgba(15,28,45,.95),rgba(5,11,19,.96));box-shadow:0 28px 80px rgba(0,0,0,.23)} .admin-page-head>div>span,.admin-panel-head span{color:#5d748b;font-size:7px;font-weight:900;letter-spacing:.16em}.admin-page-head h1{margin:9px 0 7px;font-size:36px;letter-spacing:-.045em}.admin-page-head p{max-width:760px;margin:0;color:#7f91a5;font-size:9px;line-height:1.7}.admin-page-actions{display:flex;gap:8px} .admin-primary,.admin-danger{height:42px;padding:0 18px;border:0;border-radius:11px;font-weight:850;cursor:pointer;transition:.2s ease}.admin-primary{background:#eaf4ff;color:#07111c;box-shadow:0 12px 30px rgba(84,151,230,.18)}.admin-primary:hover{transform:translateY(-1px);background:#fff}.admin-danger{border:1px solid rgba(255,112,112,.2);background:rgba(255,78,78,.08);color:#ffadad}.admin-full{width:100%} .admin-kpi-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:11px;margin-bottom:18px}.admin-kpi-grid.compact{grid-template-columns:repeat(4,minmax(0,1fr))}.admin-kpi{min-height:136px;padding:20px;border:1px solid rgba(255,255,255,.07);border-radius:18px;background:linear-gradient(155deg,rgba(15,27,42,.96),rgba(5,11,19,.98));box-shadow:0 18px 44px rgba(0,0,0,.17)} .admin-kpi span{display:block;color:#62778e;font-size:7px;font-weight:900;letter-spacing:.11em;text-transform:uppercase}.admin-kpi strong{display:block;margin-top:24px;font-size:25px;letter-spacing:-.04em}.admin-kpi small{display:block;margin-top:9px;color:#64788f;font-size:8px;line-height:1.5}.admin-kpi.primary{border-color:rgba(86,159,242,.25);background:linear-gradient(145deg,rgba(24,54,89,.96),rgba(6,16,28,.98))}.admin-kpi.positive strong{color:#8ee7bd}.admin-kpi.warning strong{color:#ffd192} .admin-dashboard-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(300px,.75fr);gap:12px}.admin-panel{padding:22px;border:1px solid rgba(255,255,255,.07);border-radius:20px;background:rgba(6,13,22,.92);box-shadow:0 20px 55px rgba(0,0,0,.15)}.admin-panel-wide{min-width:0}.admin-panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.admin-panel-head h2{margin:7px 0 0;font-size:20px;letter-spacing:-.03em}.admin-panel-head button{border:0;background:transparent;color:#83baf6;font-size:8px;font-weight:850;cursor:pointer}.admin-panel-head>strong{font-size:8px;letter-spacing:.08em} .admin-integration-card{padding:15px 0;border-top:1px solid rgba(255,255,255,.06)}.admin-integration-card:first-of-type{border-top:0}.admin-integration-card>div{display:flex;justify-content:space-between;gap:12px}.admin-integration-card span{color:#c4d0dc;font-size:9px;font-weight:800}.admin-integration-card strong{font-size:8px}.admin-integration-card p{margin:7px 0 0;color:#60748a;font-size:8px}.ok{color:#75e4ae!important}.bad{color:#ff9393!important}.warn{color:#ffd08a!important} .admin-table{overflow:hidden;border:1px solid rgba(255,255,255,.055);border-radius:14px}.admin-table-head,.admin-table-row{display:grid;align-items:center;gap:14px}.admin-table-head{padding:10px 14px;background:rgba(255,255,255,.025);color:#536a81;font-size:7px;font-weight:900;letter-spacing:.09em;text-transform:uppercase}.admin-table-row{width:100%;padding:13px 14px;border:0;border-top:1px solid rgba(255,255,255,.052);background:rgba(255,255,255,.012);color:#cbd7e3;text-align:left;font:inherit;cursor:pointer;transition:.2s ease}.admin-table-row:hover,.admin-table-row.selected{background:rgba(63,129,207,.09)}.admin-table-row>span{min-width:0;font-size:8px}.admin-table-row strong,.admin-table-row small{display:block}.admin-table-row strong{font-size:10px}.admin-table-row small{margin-top:5px;color:#60758b;font-size:7px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.admin-dashboard-grid .admin-table-head,.admin-dashboard-grid .admin-table-row{grid-template-columns:1.05fr 1.15fr .7fr .65fr}.admin-orders-table .admin-table-head,.admin-orders-table .admin-table-row{grid-template-columns:1.1fr 1.15fr .7fr .7fr .75fr}.admin-users-table .admin-table-head,.admin-users-table .admin-table-row{grid-template-columns:1.25fr .7fr .65fr .75fr .85fr}.status{display:inline-flex!important;width:max-content;padding:6px 8px;border-radius:8px;background:rgba(255,255,255,.05);font-size:7px!important;text-transform:uppercase}.status.ready{background:rgba(64,198,137,.1);color:#81e7b4}.status.processing{background:rgba(72,143,231,.12);color:#9dcbff}.status.pending{background:rgba(230,174,68,.11);color:#ffd38a}.status.cancelled,.status.refunded{background:rgba(224,85,85,.1);color:#ffaaaa} .admin-toolbar{display:grid;grid-template-columns:minmax(220px,1fr) 220px 220px auto;gap:8px;margin-bottom:12px;padding:10px;border:1px solid rgba(255,255,255,.065);border-radius:15px;background:rgba(6,13,22,.9)}.admin-toolbar input,.admin-toolbar select,.admin-field select,.admin-pricing-form input{height:42px;padding:0 13px;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:#07101b;color:#dce8f5;outline:none}.admin-toolbar button{height:42px;padding:0 18px;border:0;border-radius:10px;background:#eaf4ff;color:#07111c;font-weight:850;cursor:pointer}.admin-toolbar input:focus,.admin-toolbar select:focus,.admin-pricing-form input:focus{border-color:rgba(91,164,247,.45);box-shadow:0 0 0 3px rgba(64,139,226,.08)} .admin-split{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}.admin-split.has-detail{grid-template-columns:minmax(0,1fr) 390px}.admin-list-panel{padding:10px}.admin-detail{position:sticky;top:82px;height:max-content;padding:21px;border:1px solid rgba(91,157,232,.17);border-radius:20px;background:linear-gradient(150deg,rgba(15,29,47,.97),rgba(5,12,21,.98));box-shadow:0 28px 75px rgba(0,0,0,.28)}.admin-detail-head{display:flex;justify-content:space-between;align-items:flex-start;padding-bottom:17px;border-bottom:1px solid rgba(255,255,255,.07)}.admin-detail-head span{color:#5f7790;font-size:7px;font-weight:900;letter-spacing:.14em}.admin-detail-head h2{margin:7px 0 0;font-size:22px}.admin-detail-head button{width:32px;height:32px;border:1px solid rgba(255,255,255,.08);border-radius:9px;background:rgba(255,255,255,.03);color:#9db0c4;cursor:pointer}.admin-detail-meta{display:grid;grid-template-columns:1fr 1fr;gap:1px;margin:15px 0;border:1px solid rgba(255,255,255,.06);border-radius:12px;overflow:hidden}.admin-detail-meta>div{padding:12px;background:rgba(255,255,255,.018)}.admin-detail-meta span,.admin-detail-meta strong,.admin-detail-meta small{display:block}.admin-detail-meta span{color:#60768d;font-size:7px}.admin-detail-meta strong{margin-top:6px;font-size:9px}.admin-detail-meta small{margin-top:4px;color:#60768d;font-size:7px}.admin-order-items{display:grid;gap:7px;margin-bottom:14px}.admin-order-items article{display:flex;justify-content:space-between;gap:12px;padding:11px;border:1px solid rgba(255,255,255,.06);border-radius:11px;background:rgba(255,255,255,.018)}.admin-order-items strong,.admin-order-items small{display:block}.admin-order-items strong{font-size:8px}.admin-order-items small{margin-top:5px;color:#60758b;font-size:7px}.admin-order-items>article>span{font-size:9px;font-weight:850}.admin-detail-finance{display:grid;gap:1px;margin:14px 0;border:1px solid rgba(255,255,255,.06);border-radius:12px;overflow:hidden}.admin-detail-finance>div{display:flex;justify-content:space-between;padding:11px 12px;background:rgba(255,255,255,.018);font-size:8px}.admin-detail-finance span{color:#708399}.admin-field{display:grid;gap:7px;margin:14px 0}.admin-field>span{color:#71869c;font-size:7px;font-weight:850} .admin-catalog-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.admin-catalog-card{overflow:hidden;border:1px solid rgba(255,255,255,.07);border-radius:17px;background:linear-gradient(155deg,rgba(14,25,39,.96),rgba(5,11,18,.98));transition:.22s ease}.admin-catalog-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 36%,rgba(255,255,255,.08))}.admin-catalog-art{display:grid;place-items:center;height:92px;background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--accent) 20%,transparent),transparent 64%)}.admin-catalog-art img{width:100%;height:100%;object-fit:cover}.admin-catalog-art strong{font-size:24px;color:#f1f7ff}.admin-catalog-card>div:last-child{padding:13px}.admin-catalog-card span{color:#5f758d;font-size:7px;font-weight:850;text-transform:uppercase}.admin-catalog-card h3{min-height:34px;margin:7px 0 5px;font-size:11px;line-height:1.4}.admin-catalog-card p{margin:0 0 12px;color:#64788e;font-size:7px}.admin-catalog-card>div:last-child>strong{font-size:12px}.admin-alert{margin-bottom:12px;padding:13px 15px;border:1px solid rgba(255,118,118,.16);border-radius:12px;background:rgba(190,55,55,.07);color:#ffabab;font-size:8px} .admin-pricing-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:18px;border:1px solid rgba(255,255,255,.07);border-radius:20px;background:rgba(6,13,22,.92)}.admin-pricing-form label{display:grid;gap:8px;padding:17px;border:1px solid rgba(255,255,255,.06);border-radius:14px;background:rgba(255,255,255,.017)}.admin-pricing-form label>span{font-size:9px;font-weight:800}.admin-pricing-form label small{color:#60758b;font-size:7px;line-height:1.5}.admin-form-submit{grid-column:1/-1;display:flex;align-items:center;gap:14px;padding-top:8px}.admin-form-submit span{color:#78e2ae;font-size:8px} .admin-support-layout{display:grid;grid-template-columns:310px minmax(0,1fr);min-height:660px;border:1px solid rgba(255,255,255,.07);border-radius:20px;overflow:hidden;background:rgba(6,13,22,.92)}.admin-support-list{padding:8px;border-right:1px solid rgba(255,255,255,.065);overflow:auto}.admin-support-list button{display:block;width:100%;padding:14px;border:0;border-radius:12px;background:transparent;color:#cdd9e5;text-align:left;cursor:pointer}.admin-support-list button:hover,.admin-support-list button.active{background:rgba(66,139,224,.1)}.admin-support-list strong,.admin-support-list small{display:block}.admin-support-list p{margin:7px 0;color:#6c8096;font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.admin-support-list small{color:#50667c;font-size:7px}.admin-support-chat{display:flex;flex-direction:column;min-width:0}.admin-support-chat>header{padding:18px 20px;border-bottom:1px solid rgba(255,255,255,.065)}.admin-support-chat header strong,.admin-support-chat header small{display:block}.admin-support-chat header small{margin-top:5px;color:#60758b;font-size:7px}.admin-chat-messages{display:flex;flex-direction:column;gap:9px;flex:1;padding:20px;overflow:auto}.admin-chat-messages>div{max-width:72%;padding:11px 13px;border-radius:13px;background:rgba(255,255,255,.045)}.admin-chat-messages>div.operator{align-self:flex-end;background:rgba(64,137,225,.17)}.admin-chat-messages p{margin:0;font-size:9px;line-height:1.55}.admin-chat-messages time{display:block;margin-top:6px;color:#62768b;font-size:7px}.admin-support-chat form{display:grid;grid-template-columns:1fr auto;gap:8px;padding:12px;border-top:1px solid rgba(255,255,255,.065)}.admin-support-chat input{height:42px;padding:0 13px;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:#07101b;color:#e0ebf7;outline:none} .admin-integration-list{display:grid;gap:1px;border:1px solid rgba(255,255,255,.06);border-radius:12px;overflow:hidden}.integration-row{display:flex;justify-content:space-between;padding:12px;background:rgba(255,255,255,.018);font-size:8px}.integration-row span{color:#788ba0}.admin-security-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:12px}.admin-security-cards article{padding:20px;border:1px solid rgba(255,255,255,.07);border-radius:17px;background:rgba(6,13,22,.92)}.admin-security-cards span,.admin-security-cards strong{display:block}.admin-security-cards span{color:#657b91;font-size:7px;font-weight:850;text-transform:uppercase}.admin-security-cards strong{margin-top:18px;font-size:15px}.admin-security-cards p{margin:8px 0 0;color:#60748a;font-size:8px;line-height:1.5}.admin-session-list{display:grid;gap:1px;border:1px solid rgba(255,255,255,.055);border-radius:13px;overflow:hidden}.admin-session-list>div{display:grid;grid-template-columns:1.2fr 1fr 1fr auto;align-items:center;gap:12px;padding:12px;background:rgba(255,255,255,.018);font-size:8px}.admin-session-list strong,.admin-session-list small{display:block}.admin-session-list small{margin-top:4px;color:#63788e}.admin-session-list>div>span:not(:first-child){color:#6e8196}.admin-audit-list{display:grid;gap:1px;border:1px solid rgba(255,255,255,.055);border-radius:13px;overflow:hidden}.admin-audit-list article{display:grid;grid-template-columns:1fr 150px 150px 2fr;align-items:center;gap:14px;padding:12px;background:rgba(255,255,255,.018);font-size:8px}.admin-audit-list strong,.admin-audit-list small{display:block}.admin-audit-list small{margin-top:5px;color:#62778d}.admin-audit-list span{color:#76899e}.admin-audit-list code{color:#99b7d6}.admin-audit-list p{margin:0;color:#657a90;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.admin-empty{display:grid;place-items:center;min-height:150px;color:#61768c;font-size:9px} @media(max-width:1280px){.admin-kpi-grid{grid-template-columns:repeat(3,1fr)}.admin-catalog-grid{grid-template-columns:repeat(4,1fr)}.admin-split.has-detail{grid-template-columns:minmax(0,1fr) 350px}} @media(max-width:1000px){.admin-console{grid-template-columns:78px minmax(0,1fr)}.admin-sidebar{padding-inline:10px}.admin-sidebar-brand div,.admin-sidebar nav button span,.admin-sidebar nav button b,.admin-sidebar-foot div{display:none}.admin-sidebar-brand{justify-content:center;padding-inline:0}.admin-sidebar nav button{grid-template-columns:1fr;justify-items:center;padding:0}.admin-sidebar nav button i{width:31px;height:31px}.admin-sidebar-foot{padding-inline:0}.admin-dashboard-grid{grid-template-columns:1fr}.admin-catalog-grid{grid-template-columns:repeat(3,1fr)}.admin-split.has-detail{grid-template-columns:1fr}.admin-detail{position:static}.admin-toolbar{grid-template-columns:1fr 1fr}.admin-support-layout{grid-template-columns:250px 1fr}} @media(max-width:720px){.admin-console{display:block}.admin-sidebar{position:sticky;z-index:40;display:block;width:100%;height:auto;padding:8px;border-right:0;border-bottom:1px solid rgba(255,255,255,.07)}.admin-sidebar-brand,.admin-sidebar-foot{display:none}.admin-sidebar nav{display:flex;margin:0;overflow:auto}.admin-sidebar nav button{flex:0 0 44px;min-height:40px}.admin-topbar{top:57px;padding:0 14px}.admin-topbar time{display:none}.admin-content{padding:16px 12px 50px}.admin-page-head{align-items:flex-start;flex-direction:column;padding:22px}.admin-page-head h1{font-size:30px}.admin-kpi-grid,.admin-kpi-grid.compact{grid-template-columns:1fr 1fr}.admin-catalog-grid{grid-template-columns:1fr 1fr}.admin-toolbar{grid-template-columns:1fr}.admin-pricing-form{grid-template-columns:1fr}.admin-form-submit{grid-column:auto}.admin-support-layout{grid-template-columns:1fr}.admin-support-list{max-height:210px;border-right:0;border-bottom:1px solid rgba(255,255,255,.065)}.admin-security-cards{grid-template-columns:1fr}.admin-table{overflow:auto}.admin-table-head,.admin-table-row{min-width:720px}.admin-session-list>div,.admin-audit-list article{grid-template-columns:1fr}.admin-page-actions{width:100%}.admin-page-actions button{width:100%}} /* === v6.5 official-only artwork === */ .provider-cover{background:linear-gradient(145deg,#07111c,#02070d)} .provider-cover>img{transform:scale(1.002);filter:saturate(.96) contrast(1.02)} .provider-cover__shade{background:linear-gradient(180deg,rgba(2,6,12,0) 50%,rgba(2,6,12,.46) 100%)} .provider-cover__source{display:none!important} .provider-cover.is-error{border-color:rgba(255,255,255,.06)} .provider-cover.is-error .provider-cover__fallback{display:block} .subcategory-card:hover .provider-cover>img,.product-card:hover .provider-cover>img{transform:scale(1.035)} /* === v6.8 launch-ready visual polish === */ .hero h1{ line-height:1.01!important; letter-spacing:-.045em!important; word-spacing:.12em; } .hero h1 em{display:inline-block;letter-spacing:-.035em;word-spacing:.13em} .cursor-orbit{display:none!important} .light-trace--one{display:none!important} .theme-orbit--two{opacity:.18!important;border-color:rgba(117,177,255,.035)!important} /* Smooth, restrained entrance: Saturn + wordmark only. */ .intro{transition:opacity .9s cubic-bezier(.2,.8,.2,1),visibility .9s ease!important} .intro__noise{opacity:.045!important} .intro__spark,.intro__streak,.intro__flash,.intro__tagline{display:none!important} .intro__stage{height:430px!important} .intro__saturn{animation:introSaturnLaunch 3.65s cubic-bezier(.2,.78,.18,1) both!important} .intro__wordmark{animation:introWordLaunch 3.65s cubic-bezier(.2,.78,.18,1) both!important;letter-spacing:.16em!important} @keyframes introSaturnLaunch{ 0%{opacity:0;transform:translateY(24px) scale(.72);filter:blur(18px)} 25%{opacity:1;transform:translateY(0) scale(.94);filter:blur(2px)} 62%{opacity:1;transform:translateY(-5px) scale(1);filter:blur(0)} 88%{opacity:.78;transform:translateY(-9px) scale(1.045);filter:blur(1px)} 100%{opacity:0;transform:translateY(-18px) scale(1.10);filter:blur(10px)} } @keyframes introWordLaunch{ 0%,20%{opacity:0;transform:translateY(18px) scale(.96);filter:blur(16px)} 40%{opacity:1;transform:translateY(92px) scale(1);filter:blur(0)} 73%{opacity:1;transform:translateY(92px) scale(1);filter:blur(0)} 100%{opacity:0;transform:translateY(78px) scale(1.035);filter:blur(8px)} } .account-showcase{ margin-top:42px; margin-bottom:128px; min-height:470px; border:1px solid rgba(255,255,255,.065); border-radius:34px; background: radial-gradient(circle at 14% 25%,rgba(66,133,226,.15),transparent 34%), linear-gradient(145deg,rgba(12,20,34,.96),rgba(5,9,16,.96)); display:grid; grid-template-columns:minmax(0,1.02fr) minmax(440px,.98fr); gap:34px; padding:46px; overflow:hidden; position:relative; box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 35px 100px rgba(0,0,0,.22); } .account-showcase::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(90deg,transparent,black 48%,black)} .account-showcase>*{position:relative;z-index:1} .account-showcase .section-kicker{display:flex;align-items:center;gap:10px;color:#88a8ca;font-size:10px;font-weight:800;letter-spacing:.18em} .account-showcase .section-kicker i{width:28px;height:1px;background:linear-gradient(90deg,#a9d1ff,transparent)} .account-showcase h2{margin:24px 0 20px;font-size:clamp(48px,5vw,72px);line-height:1.02;letter-spacing:-.055em} .account-showcase h2 em{font-style:normal;color:#a8ccff} .account-showcase__content>p{max-width:660px;margin:0;color:#91a0b3;font-size:16px;line-height:1.75} .account-showcase__actions{display:flex;gap:10px;margin-top:30px} .account-showcase__actions a{height:54px;padding:0 22px;border-radius:16px;display:flex;align-items:center;gap:12px;background:linear-gradient(135deg,#f6fbff,#b9d9ff);color:#06101c;font-size:12px;font-weight:850;transition:transform .25s ease,box-shadow .25s ease} .account-showcase__actions a:hover{transform:translateY(-2px);box-shadow:0 16px 35px rgba(91,160,239,.18)} .account-showcase__actions a.secondary{background:rgba(255,255,255,.035);color:#d9e5f1;border:1px solid rgba(255,255,255,.08)} .account-showcase__features{display:grid;gap:10px;align-content:center} .account-showcase__features article{min-height:108px;padding:18px;border:1px solid rgba(255,255,255,.055);border-radius:20px;background:rgba(255,255,255,.025);display:grid;grid-template-columns:46px 1fr;gap:15px;align-items:center;transition:transform .3s cubic-bezier(.2,.8,.2,1),border-color .3s ease,background .3s ease} .account-showcase__features article:hover{transform:translateX(-4px);border-color:rgba(140,190,255,.15);background:rgba(255,255,255,.038)} .account-showcase__features article>span{width:46px;height:46px;border-radius:15px;display:grid;place-items:center;background:rgba(92,161,243,.08);color:#9ecbff} .account-showcase__features svg{width:21px;height:21px} .account-showcase__features strong{font-size:14px} .account-showcase__features p{margin:6px 0 0;color:#71869b;font-size:11px;line-height:1.55} @media(max-width:980px){ .account-showcase{grid-template-columns:1fr;padding:34px} } @media(max-width:620px){ .hero h1{letter-spacing:-.035em!important;word-spacing:.06em} .account-showcase{padding:24px;border-radius:26px;margin-bottom:82px} .account-showcase h2{font-size:42px} .account-showcase__actions{display:grid} .account-showcase__actions a{justify-content:center} } /* === v6.9 launch polish: restrained type, clean Saturn, smoother intro === */ .hero::before{display:none!important} .hero__atmosphere{border-radius:0!important;contain:none!important;overflow:visible!important} .hero-glass{display:none!important} .hero-orbit--one{opacity:.28!important} .hero-orbit--two{opacity:.18!important} .hero h1{ max-width:760px!important; font-size:clamp(56px,5.7vw,86px)!important; line-height:.98!important; letter-spacing:-.048em!important; word-spacing:.075em!important; } .hero h1 em{letter-spacing:-.04em!important;word-spacing:.08em!important} .hero__content>p{max-width:610px!important;font-size:16px!important;line-height:1.68!important} .account-showcase h2{font-size:clamp(42px,4.2vw,58px)!important;line-height:1.06!important;letter-spacing:-.045em!important} .account-showcase__content>p{font-size:14px!important;line-height:1.7!important} .intro{transition:opacity 1.05s cubic-bezier(.22,.75,.2,1),visibility 1.05s ease!important} .intro__stage{height:430px!important} .intro__saturn{animation:introSaturnSmooth 4.8s cubic-bezier(.22,.72,.2,1) both!important;will-change:transform,opacity,filter} .intro__wordmark{animation:introWordSmooth 4.8s cubic-bezier(.22,.72,.2,1) both!important;letter-spacing:.15em!important;will-change:transform,opacity,filter} @keyframes introSaturnSmooth{ 0%{opacity:0;transform:translateY(18px) scale(.84);filter:blur(10px)} 18%{opacity:.72;transform:translateY(7px) scale(.93);filter:blur(3px)} 34%{opacity:1;transform:translateY(0) scale(.985);filter:blur(0)} 72%{opacity:1;transform:translateY(-3px) scale(1);filter:blur(0)} 88%{opacity:.92;transform:translateY(-5px) scale(1.018);filter:blur(.5px)} 100%{opacity:0;transform:translateY(-9px) scale(1.045);filter:blur(5px)} } @keyframes introWordSmooth{ 0%,22%{opacity:0;transform:translateY(94px) scale(.98);filter:blur(9px)} 38%{opacity:1;transform:translateY(88px) scale(1);filter:blur(0)} 78%{opacity:1;transform:translateY(88px) scale(1);filter:blur(0)} 91%{opacity:.82;transform:translateY(86px) scale(1.008);filter:blur(.5px)} 100%{opacity:0;transform:translateY(82px) scale(1.025);filter:blur(5px)} } @media(max-width:620px){ .hero h1{font-size:clamp(48px,14vw,64px)!important;word-spacing:.04em!important} .hero__content>p{font-size:14px!important} } /* ========================================================================== */ /* FAZORA v6.10 — restored motion, short intro and clean Saturn composition */ /* ========================================================================== */ :root{ --fz-motion:cubic-bezier(.16,1,.3,1); --fz-motion-fast:cubic-bezier(.22,.82,.24,1); } /* Remove every orbit that can create a clipped vertical edge near Saturn. */ .hero-orbit, .premium-saturn__outer-orbit{display:none!important} .hero__atmosphere{ overflow:visible!important; contain:none!important; border-radius:0!important; clip-path:none!important; mask-image:none!important; } .hero__atmosphere::before{ width:980px!important; height:980px!important; right:-300px!important; top:-230px!important; filter:blur(58px)!important; background:radial-gradient(circle,rgba(70,151,255,.19) 0%,rgba(31,91,169,.085) 35%,transparent 69%)!important; } .premium-saturn__svg{overflow:visible!important} /* Short, smooth intro: total duration ~2.3 seconds. */ .intro{transition:opacity .52s var(--fz-motion-fast),visibility .52s ease!important} .intro__stage{height:390px!important} .intro__saturn{ animation:introSaturnV610 2.25s var(--fz-motion) both!important; will-change:transform,opacity,filter; } .intro__wordmark{ animation:introWordV610 2.25s var(--fz-motion) both!important; letter-spacing:.145em!important; will-change:transform,opacity,filter; } @keyframes introSaturnV610{ 0%{opacity:0;transform:translateY(16px) scale(.74);filter:blur(10px)} 24%{opacity:1;transform:translateY(2px) scale(.96);filter:blur(1px)} 63%{opacity:1;transform:translateY(-2px) scale(1);filter:blur(0)} 84%{opacity:.96;transform:translateY(-4px) scale(1.025);filter:blur(0)} 100%{opacity:0;transform:translateY(-9px) scale(1.09);filter:blur(5px)} } @keyframes introWordV610{ 0%,20%{opacity:0;transform:translateY(88px) scale(.97);filter:blur(8px)} 38%{opacity:1;transform:translateY(82px) scale(1);filter:blur(0)} 76%{opacity:1;transform:translateY(82px) scale(1);filter:blur(0)} 100%{opacity:0;transform:translateY(76px) scale(1.025);filter:blur(5px)} } /* Hero enters after the intro instead of appearing abruptly. */ body:not(.page-ready) .hero__eyebrow, body:not(.page-ready) .hero h1, body:not(.page-ready) .hero__content>p, body:not(.page-ready) .hero-categories, body:not(.page-ready) .hero__trust, body:not(.page-ready) .premium-saturn{ opacity:0; transform:translateY(18px); } body.page-ready .hero__eyebrow{animation:fzHeroEnter .58s .02s var(--fz-motion) both} body.page-ready .hero h1{animation:fzHeroEnter .72s .09s var(--fz-motion) both} body.page-ready .hero__content>p{animation:fzHeroEnter .72s .18s var(--fz-motion) both} body.page-ready .hero-categories{animation:fzHeroEnter .76s .27s var(--fz-motion) both} body.page-ready .hero__trust{animation:fzHeroEnter .7s .36s var(--fz-motion) both} body.page-ready .premium-saturn{animation:fzSaturnEnter .92s .08s var(--fz-motion) both,premiumSaturnFloat 10s 1s ease-in-out infinite!important} @keyframes fzHeroEnter{from{opacity:0;transform:translateY(22px);filter:blur(5px)}to{opacity:1;transform:none;filter:none}} @keyframes fzSaturnEnter{from{opacity:0;transform:translate3d(34px,18px,0) scale(.94);filter:blur(8px) drop-shadow(0 48px 100px rgba(0,0,0,.42))}to{opacity:1;transform:translate3d(0,0,0) scale(1);filter:blur(0) drop-shadow(0 48px 100px rgba(0,0,0,.42))}} /* Restore a visible but controlled interaction rhythm across the storefront. */ .topbar,.hero-categories button,.catalog-pill,.subcategory-card,.product-card, .account-showcase__features article,.search-launch,.catalog-back,.catalog-more button, .drawer__panel,.product-modal__card,.search-overlay__inner,.mobile-menu{ transition-timing-function:var(--fz-motion)!important; } .reveal{ opacity:0; transform:translateY(24px) scale(.988); filter:blur(5px); transition:opacity .78s ease,transform .88s var(--fz-motion),filter .7s ease!important; } .reveal.visible{opacity:1;transform:none;filter:none} .subcategory-card,.product-card{animation:fzCardEnter .56s var(--fz-motion) both} .subcategory-card:nth-child(2),.product-card:nth-child(2){animation-delay:.035s} .subcategory-card:nth-child(3),.product-card:nth-child(3){animation-delay:.07s} .subcategory-card:nth-child(4),.product-card:nth-child(4){animation-delay:.105s} .subcategory-card:nth-child(5),.product-card:nth-child(5){animation-delay:.14s} .subcategory-card:nth-child(6),.product-card:nth-child(6){animation-delay:.175s} @keyframes fzCardEnter{from{opacity:0;transform:translateY(18px) scale(.985);filter:blur(4px)}to{opacity:1;transform:none;filter:none}} @media(max-width:760px){ .intro__stage{height:340px!important} .hero__atmosphere::before{right:-440px!important;opacity:.72} } /* ========================================================================== */ /* FAZORA v6.13 — full Saturn composition rollback */ /* Restores the original rounded hero orbits and the orbit around Saturn. */ /* ========================================================================== */ .hero-orbit{ display:block!important; border-radius:50%!important; } .premium-saturn__outer-orbit{ display:block!important; opacity:1!important; visibility:visible!important; } .hero-orbit--one{opacity:.28!important} .hero-orbit--two{opacity:.18!important} /* ========================================================================== */ /* FAZORA v6.14 — responsive storefront */ /* Desktop, compact laptops, tablets, iPhone and Android. */ /* ========================================================================== */ html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:92px} body{min-width:320px} img,video,canvas{max-width:100%} button,a,input,select,textarea{-webkit-tap-highlight-color:transparent} .search-overlay,.mobile-menu,.drawer,.product-modal{min-height:100dvh} /* Wide desktop and ordinary laptops. */ @media (max-width:1440px){ :root{--frame:calc(100vw - 48px)} .topbar{left:16px!important;right:16px!important;width:auto!important;padding-inline:clamp(20px,3vw,40px)!important} .main-nav{margin-left:clamp(28px,3.5vw,54px)!important;gap:clamp(18px,2vw,28px)!important} .hero{grid-template-columns:minmax(0,1fr) minmax(440px,47vw)!important;gap:20px!important;min-height:min(850px,calc(100dvh + 44px))!important} .hero__content{min-width:0} .premium-saturn{right:-78px!important;width:min(61vw,720px)!important} .catalog-category-block,.catalog-subcategory-block{min-width:0} } @media (max-width:1280px){ :root{--frame:calc(100vw - 38px)} .topbar{left:12px!important;right:12px!important;padding-inline:22px!important} .main-nav{margin-left:24px!important;gap:18px!important} .main-nav a{font-size:12px!important} .topbar__actions{gap:8px!important} .hero{grid-template-columns:minmax(0,1fr) minmax(400px,45vw)!important;min-height:760px!important;padding-top:102px!important} .hero h1{font-size:clamp(52px,6.1vw,76px)!important} .hero__content>p{font-size:15px!important} .premium-saturn{right:-105px!important;top:82px!important;width:650px!important} .catalog-pills--large{grid-template-columns:repeat(3,minmax(0,1fr))!important} .subcategory-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important} .product-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important} } /* Small laptops and landscape tablets. */ @media (max-width:1100px){ :root{--frame:calc(100vw - 32px)} .topbar{height:68px!important;margin-top:10px!important;border-radius:19px!important;padding-inline:18px!important} .topbar.scrolled{height:64px!important} .main-nav{display:none!important} .menu-button{display:block!important} .brand__name{font-size:18px!important} .hero{display:block!important;position:relative!important;min-height:790px!important;padding-top:112px!important;padding-bottom:58px!important} .hero__content{position:relative!important;z-index:3!important;width:min(720px,72vw)!important;max-width:none!important;padding:46px 28px 38px!important} .hero h1{font-size:clamp(54px,7.4vw,76px)!important} .hero__atmosphere{inset:74px 0 0!important;overflow:hidden!important} .premium-saturn{right:-235px!important;top:90px!important;width:690px!important;opacity:.58!important} .hero-categories{grid-template-columns:repeat(3,minmax(0,1fr))!important} .catalog-top,.catalog-stage-head{align-items:flex-start!important} .catalog-stage-head{gap:16px!important;flex-wrap:wrap!important} .catalog-summary{margin-left:0!important} .catalog-pills--large{grid-template-columns:repeat(3,minmax(0,1fr))!important} .subcategory-grid,.product-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important} .product-modal__card{width:calc(100vw - 32px)!important;max-height:calc(100dvh - 32px)!important} .search-overlay__inner{width:calc(100vw - 32px)!important} } /* Portrait tablets. */ @media (max-width:900px){ :root{--frame:calc(100vw - 28px)} .hero{min-height:820px!important} .hero__content{width:min(690px,88vw)!important;padding-inline:22px!important} .premium-saturn{right:-300px!important;top:130px!important;width:680px!important;opacity:.42!important} .hero-categories{grid-template-columns:repeat(2,minmax(0,1fr))!important} .catalog-pills--large{grid-template-columns:repeat(2,minmax(0,1fr))!important} .subcategory-grid,.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important} .purchase-flow__steps{grid-template-columns:1fr!important} .account-showcase{grid-template-columns:1fr!important} .footer__inner{grid-template-columns:1fr 1fr!important;gap:34px!important} .footer__brand{grid-column:1/-1!important} .product-modal__card{grid-template-columns:1fr!important} .product-modal__visual{min-height:300px!important} } /* Phones: iPhone and Android. */ @media (max-width:700px){ :root{--frame:calc(100vw - 24px)} html{scroll-padding-top:80px} body{overscroll-behavior-y:none} .topbar{ top:max(8px,env(safe-area-inset-top))!important; left:max(8px,env(safe-area-inset-left))!important; right:max(8px,env(safe-area-inset-right))!important; height:62px!important; margin-top:0!important; padding:0 12px!important; border-radius:18px!important; } .topbar.scrolled{height:60px!important} .brand--new{gap:7px!important} .brand__saturn{width:40px!important;height:31px!important;flex-basis:40px!important} .brand__saturn-planet{width:20px!important;height:20px!important} .brand__saturn-ring{width:39px!important;height:13px!important} .brand__name{font-size:15px!important;letter-spacing:.08em!important} .topbar__actions{gap:6px!important} .topbar__language,.icon-button--counter,.profile-button{display:none!important} .icon-button,.menu-button{display:grid!important;place-items:center;width:40px!important;height:40px!important;border-radius:13px!important} .cart-button{width:54px!important;height:40px!important;padding:0 7px!important;border-radius:13px!important;gap:5px!important;justify-content:center!important} .cart-button>svg{display:block!important;width:17px!important} .cart-button span{display:none!important} .cart-button b{min-width:18px!important;height:18px!important;border-radius:6px!important;font-size:8px!important} .menu-button span{width:16px!important;margin:3px auto!important} .hero{min-height:790px!important;padding-top:90px!important;padding-bottom:38px!important} .hero__content{width:100%!important;padding:36px 4px 28px!important;text-align:left!important} .hero__eyebrow{font-size:8px!important;letter-spacing:.11em!important} .hero h1{max-width:100%!important;margin:20px 0 18px!important;font-size:clamp(41px,12.5vw,55px)!important;line-height:.98!important;letter-spacing:-.043em!important;word-spacing:.045em!important;text-wrap:balance} .hero h1 em{letter-spacing:-.038em!important} .hero__content>p{max-width:95%!important;font-size:14px!important;line-height:1.62!important} .search-launch{width:100%!important;height:56px!important;margin-top:22px!important;border-radius:17px!important;padding:0 14px!important} .search-launch svg{width:18px!important} .search-launch span{font-size:12px!important} .hero-categories{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;width:100%!important;margin-top:14px!important} .hero-categories button{min-height:68px!important;padding:12px!important;border-radius:16px!important} .hero-categories b{font-size:11px!important} .hero-categories span{font-size:8px!important} .hero__trust{display:flex!important;gap:7px!important;overflow-x:auto!important;flex-wrap:nowrap!important;padding:2px 0 8px!important;scrollbar-width:none} .hero__trust::-webkit-scrollbar{display:none} .hero__trust span{flex:0 0 auto!important;font-size:8px!important;white-space:nowrap!important} .hero__atmosphere{inset:240px -12px 0!important;height:500px!important;overflow:hidden!important;border-radius:0!important} .hero__atmosphere::before{right:-390px!important;top:10px!important;width:760px!important;height:760px!important;opacity:.8!important} .premium-saturn{right:-235px!important;top:92px!important;width:520px!important;opacity:.42!important;filter:drop-shadow(0 30px 70px rgba(0,0,0,.45))!important} .premium-saturn__dust{display:none!important} .hero-orbit--one{width:520px!important;height:520px!important;right:-310px!important;top:110px!important;opacity:.22!important} .hero-orbit--two{width:390px!important;height:390px!important;right:-255px!important;top:190px!important;opacity:.14!important} .section{padding-block:72px!important} .section-heading{display:block!important} .section-heading h2{font-size:clamp(34px,10vw,46px)!important;line-height:1.02!important} .section-heading p{font-size:12px!important;line-height:1.6!important} .catalog-section{padding-top:72px!important} .catalog-top,.catalog-stage-head{display:block!important} .catalog-search-main{width:100%!important;margin-top:15px!important} .catalog-stage-head--products>div:last-child{width:100%!important;margin-top:14px!important} .catalog-pills{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;gap:8px!important;padding-bottom:7px!important;scroll-snap-type:x proximity;scrollbar-width:none} .catalog-pills::-webkit-scrollbar{display:none} .catalog-pill{flex:0 0 auto!important;scroll-snap-align:start} .catalog-pills--large{display:grid!important;grid-template-columns:1fr 1fr!important;overflow:visible!important} .catalog-pills--large .catalog-pill{width:100%!important;min-width:0!important;height:62px!important;padding:0 11px!important;border-radius:17px!important;white-space:normal!important} .catalog-category-block,.catalog-subcategory-block{padding:14px!important;border-radius:22px!important} .catalog-category-block__head{display:block!important} .catalog-provider-status{margin-top:10px!important} .subcategory-grid,.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important} .subcategory-card,.product-card{min-width:0!important;border-radius:18px!important} .subcategory-card.has-brand-panel .subcategory-card__visual,.subcategory-card.has-cover .subcategory-card__visual{height:142px!important} .product-card__visual{height:142px!important} .subcategory-card__body,.product-card__body{padding:11px!important} .subcategory-card__body h3,.product-card h3{font-size:11px!important;line-height:1.3!important} .subcategory-card__body p{display:none!important} .product-card__bottom{gap:7px!important} .product-card__price strong{font-size:13px!important} .product-card__buy{width:34px!important;height:34px!important;border-radius:10px!important} .catalog-more button,.catalog-subcategory-more button{width:100%!important} .service-configurator{border-radius:22px!important} .service-configurator__hero{grid-template-columns:1fr!important} .service-configurator__cover{min-height:205px!important;padding:14px!important} .service-configurator__intro{padding:25px 18px!important} .service-configurator__intro h3{font-size:34px!important} .service-configurator__workspace{padding:10px!important;grid-template-columns:1fr!important} .config-section{padding:16px!important;border-radius:18px!important} .config-amount-grid,.config-fields,.config-offers{grid-template-columns:1fr!important} .config-summary{position:static!important} .purchase-flow,.account-showcase{padding:22px!important;border-radius:24px!important} .purchase-flow__intro h2,.account-showcase h2{font-size:38px!important} .account-showcase__actions{display:grid!important} .account-showcase__actions a{width:100%!important;justify-content:center!important} .footer{padding-bottom:max(26px,env(safe-area-inset-bottom))!important} .footer__inner{grid-template-columns:1fr!important} .footer__bottom{align-items:flex-start!important;flex-direction:column!important;gap:8px!important} .mobile-menu{height:100dvh!important;padding:max(18px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left))!important;overflow-y:auto!important} .mobile-menu nav{margin-top:42px!important} .mobile-menu nav a{font-size:clamp(24px,8vw,32px)!important;padding:15px 0!important} .search-overlay{padding:max(10px,env(safe-area-inset-top)) 0 max(10px,env(safe-area-inset-bottom))!important;overflow-y:auto!important} .search-overlay__inner{width:calc(100vw - 18px)!important;min-height:calc(100dvh - 20px)!important;margin:0 auto!important;padding:18px 14px!important;border-radius:22px!important} .global-search{height:58px!important;padding-right:42px!important} .global-search input{font-size:16px!important;min-width:0!important} .search-results{grid-template-columns:1fr!important} .product-modal__card{left:9px!important;right:9px!important;top:max(9px,env(safe-area-inset-top))!important;bottom:max(9px,env(safe-area-inset-bottom))!important;width:auto!important;max-height:none!important;transform:translateY(18px) scale(.98)!important;border-radius:22px!important} .product-modal.open .product-modal__card{transform:none!important} .product-modal__visual{min-height:230px!important;padding:22px!important} .product-modal__content{padding:22px 16px!important} .product-modal__content h2{font-size:27px!important} .product-modal__facts{grid-template-columns:1fr 1fr!important} .product-modal__fields{grid-template-columns:1fr!important} .product-modal__buy{align-items:stretch!important;flex-direction:column!important} .product-modal__buy button{width:100%!important} .drawer__panel{width:100%!important;border-left:0!important} .drawer__panel header{height:76px!important;padding:0 16px!important} .drawer__content,.drawer__footer{padding:14px!important} input,select,textarea{font-size:16px!important} } /* Very narrow screens. */ @media (max-width:380px){ :root{--frame:calc(100vw - 18px)} .brand__name{display:none!important} .hero{padding-top:84px!important} .hero__content{padding-top:30px!important} .hero h1{font-size:40px!important} .hero__content>p{font-size:13px!important} .hero-categories button{min-height:64px!important;padding:10px!important} .subcategory-grid,.product-grid{gap:7px!important} .product-card__visual,.subcategory-card.has-brand-panel .subcategory-card__visual,.subcategory-card.has-cover .subcategory-card__visual{height:128px!important} .catalog-pills--large .catalog-pill{height:58px!important} .product-modal__facts{grid-template-columns:1fr!important} } /* Short landscape phones and compact laptop windows. */ @media (max-height:620px) and (orientation:landscape){ .intro__stage{height:270px!important;transform:scale(.82)} .intro__skip{top:12px!important;right:14px!important} .hero{min-height:650px!important;padding-top:88px!important} .hero__content{padding-top:24px!important} .hero__atmosphere{top:60px!important} .premium-saturn{top:20px!important} .mobile-menu nav{margin-top:20px!important;display:grid!important;grid-template-columns:1fr 1fr!important;column-gap:28px!important} .mobile-menu nav a{font-size:22px!important;padding:10px 0!important} } /* Touch devices do not need desktop hover/parallax artifacts. */ @media (hover:none),(pointer:coarse){ .cursor-aura,.cursor-orbit{display:none!important} .hero__atmosphere,.premium-saturn{transition:none!important} .subcategory-card:hover,.product-card:hover,.hero-categories button:hover,.account-showcase__features article:hover{transform:none!important} .subcategory-card::before,.product-card::before,.category-tile::before,.catalog-filters::before,.brand-campaign::before{display:none!important} } /* v6.14 responsive review corrections */ @media(max-width:1100px){ .topbar__language,.icon-button--counter{display:none!important} } @media(max-width:700px){ .icon-button--counter{display:none!important} .icon-button:not(.icon-button--counter),.menu-button{display:grid!important} .hero h1{font-size:clamp(37px,10.6vw,46px)!important;white-space:nowrap!important} } @media(max-width:350px){ .hero h1{font-size:36px!important} } /* v6.14 — order page compatibility and responsive layout */ .header{position:sticky;z-index:80;top:0;min-height:76px;padding:0 max(18px,calc((100vw - 1400px)/2));display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border-bottom:1px solid rgba(255,255,255,.06);background:rgba(4,7,12,.82);backdrop-filter:blur(22px)} .logo{font-size:20px;font-weight:850;letter-spacing:.11em}.logo span{color:#8fc5ff} .header-actions{justify-self:end}.account-control{min-height:42px;padding:0 14px;border:1px solid rgba(255,255,255,.075);border-radius:13px;background:rgba(255,255,255,.025);display:flex;align-items:center;gap:9px;font-size:10px;font-weight:760} .avatar{display:grid;place-items:center;width:25px;height:25px;border-radius:8px;background:rgba(88,157,235,.08);color:#9dccff} .page-shell.shell{width:min(1160px,calc(100vw - 36px));margin:0 auto} .order-page{padding:72px 0 90px} .order-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:22px;padding:0 2px 28px;border-bottom:1px solid rgba(255,255,255,.06)} .order-hero h1{margin:12px 0 0;font-size:clamp(38px,6vw,68px);letter-spacing:-.055em} .eyebrow{display:flex;align-items:center;gap:9px;color:#85a8cb;font-size:8px;font-weight:850;letter-spacing:.14em}.eyebrow i{width:22px;height:1px;background:#8fc5ff} .order-items{display:grid;gap:10px;margin-top:22px} .order-item{padding:23px;border:1px solid rgba(255,255,255,.06);border-radius:22px;background:linear-gradient(145deg,rgba(255,255,255,.025),rgba(255,255,255,.012))} .order-item-head{display:flex;align-items:flex-start;justify-content:space-between;gap:22px}.order-item-head>div:last-child{text-align:right} .order-result{margin-top:18px;padding:17px;border:1px solid rgba(102,170,247,.11);border-radius:15px;background:rgba(61,132,215,.045)} .result-code{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px}.result-code code{min-width:0;overflow-wrap:anywhere;color:#ddecff;font-size:16px} .button{min-height:42px;padding:0 14px;border:0;border-radius:12px;background:#eaf5ff;color:#07111d;font-weight:850}.button.secondary{border:1px solid rgba(255,255,255,.075);background:rgba(255,255,255,.025);color:#d8e5f2} @media(max-width:700px){ .header{min-height:64px;padding:0 max(12px,env(safe-area-inset-right)) 0 max(12px,env(safe-area-inset-left));grid-template-columns:1fr auto} .header>div:nth-child(2){display:none}.logo{font-size:16px}.account-control{width:40px;height:40px;min-height:40px;padding:0;justify-content:center}.account-control>span:last-child{display:none} .page-shell.shell{width:calc(100vw - 20px)} .order-page{padding:34px 0 max(50px,env(safe-area-inset-bottom))} .order-hero{align-items:flex-start;flex-direction:column;padding-bottom:20px}.order-hero h1{font-size:38px} .order-item{padding:16px;border-radius:18px}.order-item-head{display:block}.order-item-head>div:last-child{display:flex;align-items:center;justify-content:space-between;margin-top:15px;text-align:left} .result-code{align-items:stretch;flex-direction:column}.result-code .button{width:100%} } /* v7.0.5 — admin balance management */ .admin-balance-list{display:grid;gap:9px}.admin-balance-user{padding:15px;border:1px solid rgba(255,255,255,.055);border-radius:15px;background:rgba(255,255,255,.012);display:grid;grid-template-columns:minmax(180px,.8fr) minmax(260px,1fr) minmax(390px,1.25fr);gap:16px;align-items:center}.admin-balance-user__identity strong,.admin-balance-user__identity small{display:block}.admin-balance-user__identity strong{font-size:11px}.admin-balance-user__identity small{margin:5px 0 8px;color:#60758b;font-size:8px}.admin-balance-user__stats{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.admin-balance-user__stats span{padding:9px;border:1px solid rgba(255,255,255,.05);border-radius:10px;color:#60758b;font-size:7px}.admin-balance-user__stats strong{display:block;margin-top:5px;color:#d4e2ef;font-size:10px}.admin-balance-form{display:grid;grid-template-columns:120px 1fr auto;gap:7px;align-items:end}.admin-balance-form label span{display:block;margin:0 0 5px;color:#61768c;font-size:7px}.admin-balance-form input{width:100%;height:39px;padding:0 10px;border:1px solid rgba(255,255,255,.08);border-radius:9px;background:#07101b;color:#dce8f5;outline:none}.admin-balance-form button{height:39px}.admin-balance-form>small{grid-column:1/-1;color:#ff9ca7;font-size:7px} @media(max-width:1200px){.admin-balance-user{grid-template-columns:1fr 1fr}.admin-balance-form{grid-column:1/-1}} @media(max-width:720px){.admin-balance-user{grid-template-columns:1fr}.admin-balance-user__stats{grid-template-columns:repeat(3,minmax(90px,1fr));overflow:auto}.admin-balance-form{grid-template-columns:1fr}.admin-balance-form>small{grid-column:auto}}