/* ============================================
   GLOBAL RESET – fælles basis for hele siden
   ============================================ */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Forhindrer vandret scroll på hele siden */
html, body {
    overflow-x: hidden;  /* Forhindrer vandret scroll */
}

/* ==================== BODY ====================
   Global baggrund (gradient + blå ring), gælder
   for ALLE sider, med mindre det overskrives.
================================================ */
body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;

    /* Lys baggrund + farvegradient – giver siden et varmt udtryk */
    background-color: #ffffff;
    background-image: linear-gradient(180deg,
        rgba(10, 120, 55, 0.30)   0%,    /* Grøn – natur og balance */
        rgba(10, 120, 55, 0.30)   18%,
        rgba(239, 116, 34, 0.30)  42%,   /* Orange – varme og energi */
        rgba(239, 116, 34, 0.30)  58%,
        rgba(254, 183, 23, 0.30)  78%,   /* Gul – håb og lys */
        rgba(254, 183, 23, 0.30)  100%
    );
    background-attachment: fixed;        /* Gør gradienten “fastlåst” når man scroller */

    color: #dddddd;                      /* Grundfarve til tekst, overskrives ofte */
    line-height: 1.6;
    min-height: 100vh;
    position: relative;

    padding-bottom: 100px;               /* Plads til footer */
}

/* ==================== DEN STORE BLÅ CIRKEL – MOBILVENLIG ==================== */
body::before {
    content: '';
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 2250px;        /* Standardstørrelse på desktop */
    height: 2250px;
    border: 150px solid #015fabbd;  
    border-radius: 80%;
    filter: blur(50px);
    pointer-events: none;
    z-index: -1;
    box-shadow: 0 0 180px 80px rgba(1, 94, 171, 0.22);
}

/* Mindre skærme (tablets og små desktops) */
@media (max-width: 1600px) {
    body::before {
        width: 2000px;
        height: 2000px;
        border-width: 120px;
        filter: blur(45px);
    }
}

/* Mobile skærme */
@media (max-width: 768px) {
    body::before {
        width: 1500px;
        height: 1500px;
        border-width: 100px;
        filter: blur(40px);
    }
}

/* Meget små telefoner */
@media (max-width: 480px) {
    body::before {
        width: 1200px;
        height: 1200px;
        border-width: 80px;
        filter: blur(35px);
    }
}