Modify  this code so the alignment appear correctly and in the middle :
$w("#answer1").html = `
        <div style="font-family: Bitter; color: #262627; background-color: #F5F5F5; padding: 20px; height: 100%; box-sizing: border-box;">
        <div style="display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; grid-template-rows: auto; height: 100%;">
    
            <!-- Main Age Display -->
            <div style="grid-column: 1 / -1; text-align: center; background: rgba(38, 38, 39, 0.03); border-radius: 15px; padding: 20px;">
                <h1 style="font-size: 36px; margin-bottom: 10px;">Your Life Journey</h1>
                <div style="font-size: 48px; font-weight: bold; margin: 0;">
                    ${years}<span style="font-size: 24px; font-weight: normal;"> years </span> 
                    ${months}<span style="font-size: 24px; font-weight: normal;"> months </span> 
                    ${days}<span style="font-size: 24px; font-weight: normal;"> days </span>
                </div>
            </div>
    
            <!-- Timeline Stats - Adjusted for Vertical Layout and Centering -->
            <div style="grid-column: 1 / -1; background: rgba(38, 38, 39, 0.03); border-radius: 15px; padding: 20px; text-align: center;">
                <h2 style="font-size: 24px; margin-bottom: 15px;">Your Timeline</h2>
                <div style="display: flex; flex-direction: column; justify-content: center; align-items: center;">
                    <div style="margin-bottom: 15px;">
                        <div style="font-size: 32px; font-weight: bold;">${totalMonths}</div>
                        <div style="font-size: 16px;">Months</div>
                    </div>
                    <div style="margin-bottom: 15px;">
                        <div style="font-size: 32px; font-weight: bold;">${totalWeeks}</div>
                        <div style="font-size: 16px;">Weeks</div>
                    </div>
                    <div style="margin-bottom: 15px;">
                        <div style="font-size: 32px; font-weight: bold;">${totalDays}</div>
                        <div style="font-size: 16px;">Days</div>
                    </div>
                    <div style="margin-bottom: 15px;">
                        <div style="font-size: 32px; font-weight: bold;">${Math.floor(totalDays * 24)}</div>
                        <div style="font-size: 16px;">Hours</div>
                    </div>
                </div>
            </div>
    
            <!-- Birthday Countdown -->
            <div style="grid-column: 1 / -1; background: rgba(38, 38, 39, 0.03); border-radius: 15px; padding: 20px; text-align: center;">
                <h2 style="font-size: 24px; margin-bottom: 15px;">Next Birthday</h2>
                <div>
                    <div style="font-size: 48px; font-weight: bold;">${daysToNextBirthday}</div>
                    <div style="font-size: 20px;">Days until your birthday</div>
                    <div style="font-size: 18px; margin-top: 10px;">It will be on a <span style="font-weight: bold;">${nextBirthdayDay}</span></div>
                </div>
            </div>
    
            <!-- Birth Story - Adjusted for Vertical Layout and Centering -->
            <div style="grid-column: 1 / -1; background: rgba(38, 38, 39, 0.03); border-radius: 15px; padding: 20px; text-align: center;">
                <h2 style="font-size: 24px; margin-bottom: 15px;">Your Birth Story</h2>
                <div style="display: flex; flex-direction: column; justify-content: center; align-items: center;">
                    <div style="margin-bottom: 15px;">
                        <div style="font-size: 36px;">♍️</div>
                        <div style="font-weight: bold; font-size: 20px;">Zodiac Sign</div>
                        <div style="font-size: 20px;">Virgo</div>
                    </div>
                    <div style="margin-bottom: 15px;">
                        <div style="font-size: 36px;">📅</div>
                        <div style="font-weight: bold; font-size: 20px;">Born On</div>
                        <div style="font-size: 20px;">Saturday</div>
                    </div>
                    <div style="margin-bottom: 15px;">
                        <div style="font-size: 36px;">🍁</div>
                        <div style="font-weight: bold; font-size: 20px;">Season</div>
                        <div style="font-size: 20px;">Autumn</div>
                    </div>
                </div>
            </div>
        </div>
    </div>