.center-text {
   text-align: center;
   align-items: center;
   justify-content: center;
   display: flex;
   flex-direction: row; 
   flex-wrap: wrap;
}

.grid-container {
   display: grid;
   place-items: center;
   align-items: center;
   padding: 1px;
}


.mobile-only {
   display: none;
}

.display-hidden {
    display: none;
}

header, footer {
    width: auto;
    height: auto;
}

p {

   color:#d689ff;
   font-size: clamp(14px, 4vw, 18px);
   font-family: Lucida Console, monospace;
   text-align: center;
   align-items: center;
   word-spacing: 5px;
   border-color: #a600ff; 
   border-width: 5px; 
   border-top-style: double; 
   border-bottom-style: double; 
   border-left-style: solid; 
   border-right-style: solid; 
   width: 100%;
   max-width: 1000px;
   padding: 10px;
   margin: 20px auto;
   box-sizing: border-box;

}

 h6 {

   color:#d689ff;
   font-size: clamp(14px, 4vw, 18px);
   font-family: Lucida Console, monospace;
   text-align: center;
   align-items: center;
   word-spacing: 1px;
   border-color: #a600ff; 
   border-width: 5px; 
   border-top-style: double; 
   border-bottom-style: double; 
   border-left-style: solid; 
   border-right-style: solid; 
   width: 100%;
   max-width: 1000px;
   margin: 20px auto;
}

hr {
   text-align: center;
   align-items: center;
   word-spacing: 1px;
   color: #a600ff; 
   border-width: 5px; 
   border-top-style: double; 
   border-bottom-style: double; 
   border-left-style: solid; 
   border-right-style: solid; 
   width: 100%;
   max-width: 1000px;
   margin: 20px auto;
}

h1 {
   color:#d689ff;
   font-size: clamp(18px, 6vw, 25px);
   font-family: Lucida Console, monospace;
   text-align: center;
   align-items: center;
   padding: 10px;
}

h2 {
   color:#d689ff;
   font-size: clamp(18px, 6vw, 25px);
   font-family: Lucida Console, monospace;
   text-align: center;
   align-items: center;
   padding: 10px;
}
h3 {
   color:#080708;
   font-size: clamp(10px, 3vw, 12px);
   font-family: Lucida Console, monospace;
   text-align: center;
   align-items: center;

}

h4 {
    color:#d689ff;
    font-size: clamp(18px, 6vw, 25px);
    font-family: Lucida Console, monospace;
    text-align: center;
    align-items: center;
    padding: 10px;
    
}

h2:hover {
   text-decoration: underline;
   cursor: pointer;
}

h1:hover {
    text-decoration: underline;
    cursor: pointer;
    
}

h4:active {
   text-decoration: underline;
   color:#e3afff;
}

body {
   padding: 0;
   margin: 0;
   width: 100%;
   background-color: #080708;
   line-height: 23px;
}

a {
   text-decoration: none;
   font-size: clamp(16px, 5vw, 25px);
   font-family: Lucida Console, monospace;
   color:#d689ff;
   margin: 5px;
   display: inline-block;
   padding: 8px 12px;
   border-radius: 4px;
   transition: all 0.3s ease;
}

a:hover {
   text-decoration: underline;
   transform: scale(1.02);
}

a:active {
   text-decoration: underline;
   font-family: Lucida Console, monospace;
   color:#e3afff;
   margin: 5px;
}

@media (max-width: 768px) {
    .page-title {
        font-size: 1.8rem;
    }

    .section-heading {
        font-size: 1.5rem;
    }

    .notice {
        font-size: 1.2rem;
    }

    .profile-img {
        max-width: 260px;
    }
}

@media (max-width: 480px) {
    .grid-container {
        padding: 0 12px;
    }

    .page-title {
        font-size: 1.4rem;
    }

    .section-heading {
        font-size: 1.3rem;
    }

    p {
        font-size: 0.95rem;
    }

    .footer-links {
        flex-direction: column;
        align-items: center;
    }
}