* {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }



     .center-wrapper {
            display: flex;
            justify-content: center;   /* Horizontal center */
            align-items: center;       /* Vertical center */
            min-height: 100vh;         /* Take full screen height */
        }

        .containers {
            padding: 10%;
            height: 100%;
            max-width: 800px;
            width: 100%;
            background: white;
            border-radius: 20px;
            box-shadow: 0 20px 60px rgba(212, 175, 55, 0.4);
            overflow: hidden;
        }

        .headerss {
            
            background: linear-gradient(135deg, #000 0%, #1a1a1a 100%);
            color: white;
            padding: 40px;
            text-align: center;
            border-bottom: 5px solid #d4af37;
        }


        .tagline {
            font-size: 1.3em;
            color: #d4af37;
            font-weight: bold;
        }

        .promo-section {
            /* background: linear-gradient(90deg, #bfa046, #FFD700); */
            padding: 5%;
            text-align: center;
        }

.promo-section h1 {
    color: gold;
    font-weight: 700;
    font-size: 2.5rem; /* adjust for visual balance */

    margin-bottom: 20px;
}

        .promo-section p {
            font-size: 1.15em;
            line-height: 1.8;
            color: #fff;
            max-width: 700px;
            margin: 0 auto;
        }

        .form-section {
            width: 60%;
            margin: 0 auto;
            padding: 2% 8% 2% 10%;
            box-sizing: border-box; /* ensures padding doesn’t break layout */
        }



        .form-section h3 {
            font-size: 2em;
            color: #000;
            margin-bottom: 30px;
            text-align: center;
        }

        .form-group {
            margin-bottom: 25px;
        }

        .form-group label {
            display: block;
            margin-bottom: 8px;
            color: #333;
            font-weight: 600;
            font-size: 1em;
        }

        .form-group input,
        .form-group textarea,
        .form-group select {
            width: 100%;
            padding: 15px;
            border: 2px solid #ddd;
            border-radius: 8px;
            font-size: 1em;
            font-family: inherit;
            transition: border-color 0.3s;
        }

        .form-group input:focus,
        .form-group textarea:focus,
        .form-group select:focus {
            outline: none;
            border-color: #d4af37;
        }

        .form-group textarea {
            resize: vertical;
            min-height: 100px;
        }

        .submit-button {
            background: linear-gradient(135deg, #d4af37 0%, #f4d03f 100%);
            color: #000;
            padding: 18px 50px;
            border: none;
            border-radius: 50px;
            font-size: 1.3em;
            font-weight: bold;
            cursor: pointer;
            transition: all 0.3s ease;
            box-shadow: 0 5px 15px rgba(212, 175, 55, 0.4);
            text-transform: uppercase;
            letter-spacing: 1px;
            width: 100%;
            margin-top: 10px;
        }

        .submit-button:hover {
            transform: translateY(-3px);
            box-shadow: 0 8px 25px rgba(212, 175, 55, 0.6);
        }

        .contact-info {
            background: #f8f8f8;
            padding: 30px 40px;
            text-align: center;
            border-top: 2px solid #d4af37;
        }

        .contact-info p {
            color: #666;
            margin-bottom: 10px;
            font-size: 1em;
        }

        .contact-info strong {
            color: #000;
        }

        @media (max-width: 768px) {
            .logo {
                font-size: 1.8em;
            }

            .promo-section {
                padding: 30px 20px;
            }

            .promo-section h2 {
                font-size: 1.6em;
            }

            .promo-section p {
                font-size: 1em;
            }

            .form-section {
                padding: 40px 20px;
            }

            .contact-info {
                padding: 20px;
            }
        }

        @keyframes pulse {
            0%, 100% {
                transform: scale(1);
            }
            50% {
                transform: scale(1.02);
            }
        }

        .pulse-animation {
            animation: pulse 2s infinite;
        }



        .center-wrapper {
    display: flex;
    justify-content: center;    /* Center horizontally */
    align-items: center;        /* Center vertically */
    min-height: 100vh;          /* Full screen height */
    padding: 20px;              /* Prevent edges from touching on small screens */
}

.containers {
    padding: 10%;
    height: 100%;
    max-width: 800px;
    width: 100%;
    background: white;
    border-radius: 20px;
    box-shadow: 0 20px 60px rgba(212, 175, 55, 0.4);
    overflow: hidden;
    transition: all 0.3s ease-in-out;
}

/* 📱 Responsive adjustments for tablets and phones */
@media (max-width: 768px) {
    .containers {
        max-width: 90%;       /* Shrinks width on tablets */
        padding: 8%;          /* Slightly less padding */
        border-radius: 16px;
    }
}

@media (max-width: 480px) {
    .containers {
        max-width: 95%;       /* Fill almost full width */
        padding: 6%;          /* Reduce padding further */
        border-radius: 12px;  /* Softer corners for small screens */
        box-shadow: 0 10px 30px rgba(212, 175, 55, 0.3);
    }
}



/* new--------------------------- */
.hero-content {
    max-width: 800px;            /* Control content width */
    width: 90%;                  /* Responsive width */
    padding: 5%;                 /* Inner padding */
    background: white;           /* Optional box background */
    border-radius: 20px;         /* Rounded corners */
    box-shadow: 0 15px 50px rgba(212, 175, 55, 0.3); /* Soft shadow */
    text-align: center;          /* Center text inside */
}

.hero-content h2 {
    font-size: 2rem;             /* Heading size */
    margin-bottom: 1rem;
}

.hero-content p {
    font-size: 1rem;
    line-height: 1.6;
}




.hero-section {
    height: 100vh; /* full screen height */
    background-image: url("{% static 'img/gym pulse/21.jpg' %}");
    background-size: cover;
    background-position: center bottom;
    background-repeat: no-repeat;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
}


/* Dark overlay BEHIND the text */
.hero-section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6); /* black shadow */
    z-index: 0; /* behind the text */
}

/* Make sure content is ABOVE overlay */
.promo-section {
    position: relative;
    z-index: 1;
    text-align: center;
    padding: 5%;
}

.promo-section h1 {
    color: gold;
    font-weight: 700;
    font-size: 2.5rem;
    margin-bottom: 20px;
}

.promo-section p {
    font-size: 1.15em;
    line-height: 1.8;
    color: #fff;
    max-width: 700px;
    margin: 0 auto;
}