.section-number{position:absolute;top:20px;right:20px;background:var(--accent-color);color:var(--background-color);width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-headings);font-weight:bold;font-size:1.1rem;line-height:1;box-shadow:0 3px 10px rgba(0,0,0,0.3)}.items-grid{display:grid;grid-template-columns:repeat(4,1fr);padding:30px;gap:20px 10px;justify-items:center;align-items:center}.items-grid--3{grid-template-columns:repeat(3,1fr)}.unit-icon{width:60px;height:60px;background:var(--background-darker-2-color);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.5rem;color:var(--accent-color);margin:0 auto 10px}.items-grid>div{display:flex;flex-direction:column;align-items:center;padding:20px;background:linear-gradient(145deg,#fff,#f0ede8);border-radius:16px;border:2px solid rgba(212,184,150,0.3);position:relative;transition:all .3s cubic-bezier(0.4,0,0.2,1);min-height:120px;width:100%;box-sizing:border-box;overflow:hidden}.items-grid>div::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(212,175,55,0.1) 0,rgba(212,184,150,0.1) 100%);opacity:0;transition:opacity .3s ease;z-index:1}.items-grid>div:hover::before{opacity:1}.items-grid>div:hover{transform:translateY(-8px) scale(1.05);box-shadow:0 15px 35px rgba(0,0,0,0.2),0 5px 15px rgba(212,175,55,0.3),inset 0 1px 0 rgba(255,255,255,0.8);border-color:var(--accent-gold);background:linear-gradient(145deg,#fff,var(--hover-bg))}.grid-icon{width:60px;height:60px;display:block;margin:0 auto 15px;object-fit:contain;position:relative;z-index:2;filter:drop-shadow(0 4px 8px rgba(0,0,0,0.2));transition:all .3s ease}.items-grid>div:hover .grid-icon{filter:drop-shadow(0 8px 16px rgba(0,0,0,0.3)) drop-shadow(0 0 20px rgba(255,215,0,0.6));transform:scale(1.1)}.grid-text-item{font-size:14px;font-weight:600;color:var(--text-primary);text-align:center;line-height:1.2;position:relative;z-index:2;transition:all .3s ease;text-shadow:0 1px 2px rgba(255,255,255,0.8)}.items-grid>div:hover .grid-text-item{color:var(--accent-gold);text-shadow:0 2px 4px rgba(0,0,0,0.2);transform:translateY(-2px)}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}.items-grid>div:nth-child(even){animation:float 6s ease-in-out infinite;animation-delay:.5s}.items-grid>div:nth-child(odd){animation:float 6s ease-in-out infinite;animation-delay:1s}@media(max-width:1024px){.items-grid,.items-grid--3{grid-template-columns:repeat(2,1fr);gap:20px}}@media(max-width:768px){.items-grid,.items-grid--3{grid-template-columns:repeat(2,1fr);gap:15px}.visual-content{padding:20px}}@media(max-width:380px){.gameplay-visual:has(.items-grid){display:none}.items-grid{display:none}}.items-grid>div::after{content:'';position:absolute;top:50%;left:50%;width:0;height:0;background:radial-gradient(circle,rgba(212,175,55,0.3) 0,transparent 70%);transform:translate(-50%,-50%);transition:all .4s ease;z-index:0}.items-grid>div:hover::after{width:120%;height:120%}.cards-stack{position:relative;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.card-item{position:absolute;width:300px;height:514px;transition:all .4s cubic-bezier(0.25,0.46,0.45,0.94);cursor:pointer;border-radius:15px;overflow:hidden;box-shadow:0 8px 25px rgba(0,0,0,0.3)}.card-item img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}.card-item:nth-child(1){z-index:3;transform:translateX(-100px) translateY(20px) rotate(-8deg)}.card-item:nth-child(2){z-index:2;transform:translateX(0) translateY(0) rotate(0)}.card-item:nth-child(3){z-index:1;transform:translateX(100px) translateY(20px) rotate(8deg)}.card-item:nth-child(1):hover{z-index:10;transform:translateX(-120px) translateY(-40px) rotate(-12deg) scale(1.08);box-shadow:0 12px 35px rgba(0,0,0,0.4)}.card-item:nth-child(2):hover{z-index:10;transform:translateX(0) translateY(-50px) rotate(0) scale(1.1);box-shadow:0 12px 35px rgba(0,0,0,0.4)}.card-item:nth-child(3):hover{z-index:10;transform:translateX(120px) translateY(-40px) rotate(12deg) scale(1.08);box-shadow:0 12px 35px rgba(0,0,0,0.4)}.cards-stack:hover .card-item:not(:hover){transform:scale(0.95)}.cards-stack:hover .card-item:nth-child(1):not(:hover){z-index:1;transform:translateX(-140px) translateY(30px) rotate(-6deg) scale(0.92);filter:brightness(0.85) saturate(0.8) blur(1px)}.cards-stack:hover .card-item:nth-child(2):not(:hover){z-index:1;transform:translateX(0) translateY(20px) rotate(0) scale(0.92);filter:brightness(0.85) saturate(0.8) blur(1px)}.cards-stack:hover .card-item:nth-child(3):not(:hover){z-index:1;transform:translateX(140px) translateY(30px) rotate(6deg) scale(0.92);filter:brightness(0.85) saturate(0.8) blur(1px)}@media(max-width:1024px){.card-item:nth-child(1){transform:translateX(-80px) translateY(20px) rotate(-8deg)}.card-item:nth-child(3){transform:translateX(80px) translateY(20px) rotate(8deg)}}@media(max-width:768px){.card-item{width:180px;height:308px}.card-item:nth-child(1){transform:translateX(-70px) translateY(20px) rotate(-8deg)}.card-item:nth-child(3){transform:translateX(70px) translateY(20px) rotate(8deg)}.card-item:nth-child(1):hover{transform:translateX(-80px) translateY(-40px) rotate(-12deg) scale(1.08)}.card-item:nth-child(3):hover{transform:translateX(80px) translateY(-40px) rotate(12deg) scale(1.08)}.cards-stack:hover .card-item:nth-child(1):not(:hover){transform:translateX(-100px) translateY(30px) rotate(-6deg) scale(0.92);filter:brightness(0.9) blur(1px)}.cards-stack:hover .card-item:nth-child(3):not(:hover){transform:translateX(100px) translateY(30px) rotate(6deg) scale(0.92)}}@media(max-width:480px){.card-item{width:165px;height:283px}.card-item:nth-child(1){transform:translateX(-50px) translateY(20px) rotate(-8deg)}.card-item:nth-child(3){transform:translateX(50px) translateY(20px) rotate(8deg)}.card-item:nth-child(1):hover{transform:translateX(-40px) translateY(-40px) rotate(-12deg) scale(1.08)}.card-item:nth-child(3):hover{transform:translateX(40px) translateY(-40px) rotate(12deg) scale(1.08)}.cards-stack:hover .card-item:nth-child(1):not(:hover){transform:translateX(-80px) translateY(30px) rotate(-6deg) scale(0.92);filter:brightness(0.9) blur(1px)}.cards-stack:hover .card-item:nth-child(3):not(:hover){transform:translateX(80px) translateY(30px) rotate(6deg) scale(0.92)}}