*, *::before, *::after { box-sizing: border-box; }.header{background-color:rgba(11,20,28,0.8);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid rgba(255,255,255,0.08);position:fixed;top:0;left:0;width:100%;z-index:10000;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text",system-ui,sans-serif}.header__container{max-width:1200px;margin:0 auto;padding:14px 20px;display:flex;align-items:center;justify-content:space-between;position:relative}.header__logo{font-size:20px;font-weight:700;text-decoration:none;display:flex;align-items:center;letter-spacing:-0.02em}.header__logo-pay{color:#ffffff}.header__logo-gc{color:#3b82f6}.header__navigation{display:flex;align-items:center;gap:32px;margin-left:auto}.header__menu{display:flex;align-items:center;gap:4px}.header__menu-link{color:#abc1de;text-decoration:none;font-size:14px;font-weight:500;padding:8px 16px;border-radius:99px;transition:all 0.2s ease}.header__mobile-actions{display:none;align-items:center;gap:12px}.header__btn{background:#3b82f6;color:#ffffff;text-decoration:none;font-size:14px;font-weight:600;padding:10px 24px;border-radius:12px;transition:all 0.2s ease;white-space:nowrap}.header__hamburger{background-color:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.08);cursor:pointer;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:42px;height:42px;border-radius:12px;z-index:10001;transition:all 0.2s ease;padding:0}.header__hamburger-line{display:block;width:18px;height:1.5px;background-color:#ffffff;transition:all 0.25s cubic-bezier(0.25,0.1,0.25,1);transform-origin:center}.header__mobile-only{display:none}@media(hover:hover){.header__menu-link:hover{color:#ffffff;background-color:rgba(255,255,255,0.06)}.header__btn:hover{filter:brightness(1.1);transform:translateY(-0.5px)}.header__hamburger:hover{background-color:rgba(255,255,255,0.08);border-color:rgba(255,255,255,0.2)}}.header__btn:active{transform:translateY(0.5px);filter:brightness(0.9)}@media(max-width:768px){.header__desktop-only{display:none!important}.header__mobile-only{display:block}.header__mobile-actions{display:flex}.header__navigation{display:none;position:absolute;top:100%;left:0;width:100%;background-color:#0b141c;border-top:1px solid rgba(255,255,255,0.08);border-bottom:1px solid rgba(255,255,255,0.08);padding:12px; box-shadow:0 20px 40px rgba(0,0,0,0.3);flex-direction:column;gap:16px;margin-left:0}.header__navigation--active{display:flex}.header__container{padding:14px 12px}.header__menu{flex-direction:column;width:100%;gap:6px}.header__menu-link{display:block;width:100%;text-align:center;padding:14px;border-radius:12px;font-size:15px;background-color:#131e3a}.header__hamburger--open .header__hamburger-line:nth-child(1){transform:translateY(6.5px) rotate(45deg)}.header__hamburger--open .header__hamburger-line:nth-child(2){opacity:0;transform:scaleX(0)}.header__hamburger--open .header__hamburger-line:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}}
.footer {background-color: #0b141c; color: #abc1de; font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Icons", system-ui, sans-serif; font-size: 14px; padding-top: 50px; border-top: 1px solid #1e293b; box-shadow: inset 0 20px 20px -20px rgba(37, 99, 235, 0.15); } .footer-container { max-width: 1200px; margin: 0 auto; padding: 0 20px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20px; } .footer-column { flex: 1; min-width: 220px; margin-bottom: 30px; } .footer-about { display: flex; flex-direction: column; gap: 12px; } .footer-logo { font-size: 24px; font-weight: bold; margin-bottom: 12px; } .logo-pay { color: #ffffff; } .logo-gc { color: #2563eb; } .support-hours { font-size: 13px; color: #64748b; margin-bottom: 5px; line-height: 1.4; } .footer-column h3 { color: #ffffff; font-size: 16px; margin-bottom: 20px; font-weight: 600; } .footer-buttons-group { display: flex; flex-direction: column; gap: 8px; } .footer-btn { display: block; background-color: #131e3a; color: #abc1de; text-decoration: none; padding: 10px 14px; border-radius: 8px; font-weight: 500; transition: all 0.2s ease-in-out; text-align: left; border: 1px solid transparent; } .tg-button { display: block; width: 100%; background-color: #2563eb; color: #ffffff; text-decoration: none; padding: 12px 20px; border-radius: 8px; font-weight: 600; text-align: center; transition: background-color 0.2s, transform 0.2s; } .max-button { display: block; width: 100%; background-color: #1e2530; color: #ffffff; text-decoration: none; padding: 12px 20px; border-radius: 8px; font-weight: 600; text-align: center; border: 1px solid #2d3748; transition: background-color 0.2s ease, transform 0.2s ease; } .max-button:active { background-color: #121820; border-color: #3b82f6; } .support-email { display: inline-flex; align-items: center; justify-content: flex-start; color: #64748b; text-decoration: none; font-size: 13px; margin-top: 6px; transition: color 0.2s ease; width: 100%; text-align: left; } .footer-bottom { border-top: 1px solid #1e293b; margin-top: 20px; padding: 25px 0; background-color: #060d13; } .footer-bottom-container { max-width: 1200px; margin: 0 auto; padding: 0 20px; display: flex; flex-direction: column; align-items: center; gap: 15px; text-align: center; } .payment-section { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 20px; margin-bottom: 20px; width: 100%; } .payment-title { font-size: 15px; font-weight: 600; color: #ffffff; white-space: nowrap; } .payment-methods { display: flex; flex-direction: row; align-items: center; gap: 10px; flex-wrap: wrap; } .payment-badge { display: inline-flex; align-items: center; justify-content: center; background-color: #131e3a; padding: 4px 8px; border-radius: 6px; border: 1px solid #1e293b; height: 32px; min-width: 50px; transition: all 0.2s ease-in-out; cursor: pointer; } .tbank-badge { background-color: #2b2b2b; } .legal-info { font-size: 12px; color: #64748b; } .legal-info a { color: #64748b; } .cookie-banner { position: fixed; bottom: 24px; right: 24px; background-color: rgba(22, 22, 23, 0.8); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); color: #f5f5f7; padding: 24px 28px; border-radius: 18px; width: 340px; border: 1px solid rgba(255, 255, 255, 0.08); box-shadow: 0 12px 40px rgba(0,0,0,0.5); z-index: 9999; text-align: center; font-family: inherit; } .cookie-text { font-size: 13.5px; line-height: 1.45; margin: 0 0 16px 0; padding: 0 5px; color: #e8e8ed; letter-spacing: -0.01em; } .cookie-text a { color: #2997ff; text-decoration: none; } .cookie-accept { background-color: #2d2d30; color: #f5f5f7; border: none; padding: 9px 24px; border-radius: 18px; font-size: 13px; font-weight: 500; cursor: pointer; transition: background-color 0.15s ease; width: auto; display: inline-block; } .cookie-close { position: absolute; top: 14px; right: 14px; background: none; border: none; color: #86868b; cursor: pointer; transition: color 0.15s; display: flex; align-items: center; justify-content: center; padding: 4px; } @media (hover: hover) { .footer-btn:hover { background-color: #1d2d54; color: #ffffff; border-color: #2563eb; transform: translateX(4px); } .tg-button:hover { background-color: #1d4ed8; transform: translateY(-2px); } .max-button:hover { background-color: #272f3d; transform: translateY(-2px); } .support-email:hover { color: #ffffff; } .payment-badge:hover { background-color: #1d2d54; border-color: #2563eb; transform: translateY(-2px); } .cookie-accept:hover { background-color: #3a3a3c; } .cookie-text a:hover { text-decoration: underline; } .cookie-close:hover { color: #f5f5f7; } } @media (max-width: 768px) { .footer-container { flex-direction: column; padding: 0 12px;} .footer-column { min-width: 100%; margin-bottom: 15px; } .footer-btn { border-radius: 12px; padding: 16px 16px !important; } .tg-button { border-radius: 12px; padding: 16px 20px !important; } .max-button { border-radius: 12px; padding: 16px 20px !important; } .payment-section { flex-direction: column; align-items: flex-start; gap: 12px; } .cookie-banner { width: calc(100% - 32px); left: 16px; bottom: 16px; } }