/* TGGATE — шаблон «Сайт на ремонте» (внешний CSS: CSP decoy запрещает инлайн) */
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Segoe UI', system-ui, sans-serif;
    background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
    color: #e2e8f0;
    overflow: hidden;
}
.container { text-align: center; padding: 2rem; max-width: 600px; }
.gear {
    width: 120px; height: 120px;
    margin: 0 auto 2rem;
    animation: spin 6s linear infinite;
    display: block;
}
.gear.small {
    width: 60px; height: 60px;
    position: absolute;
    right: 10px; top: 0;
    animation: spin-reverse 4s linear infinite;
}
.gear-wrap { position: relative; width: 200px; height: 140px; margin: 0 auto 2rem; }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes spin-reverse { to { transform: rotate(-360deg); } }
h1 { font-size: 2rem; margin-bottom: 1rem; font-weight: 700; }
p { color: #94a3b8; font-size: 1.1rem; line-height: 1.6; margin-bottom: 2rem; }
.progress {
    width: 100%; height: 6px;
    background: #334155;
    border-radius: 999px;
    overflow: hidden;
}
.progress-bar {
    height: 100%; width: 40%;
    background: linear-gradient(90deg, #3b82f6, #8b5cf6);
    border-radius: 999px;
    animation: load 2.5s ease-in-out infinite;
}
@keyframes load {
    0% { transform: translateX(-100%); width: 40%; }
    50% { width: 60%; }
    100% { transform: translateX(350%); width: 40%; }
}
.badge-box {
    display: inline-block; margin-top: 2rem;
    padding: 0.4rem 1rem;
    background: rgba(59, 130, 246, 0.15);
    border: 1px solid rgba(59, 130, 246, 0.3);
    border-radius: 999px;
    font-size: 0.85rem; color: #93c5fd;
}
