/* =======================
   Global Variables
   ======================= */

   
   :root {

    
    /* ==============================================
                        CORE VARIABLES
       ============================================== */
        --geon-primary: #004466;
        --geon-secondary: #ccbb88;
        --light-bg: white;
        --dark-bg: rgb(230, 230, 230);
        --heading-text-color: black;
        --basic-text-color: black;

        --very-big-font: 65px;
        --large-font: 50px;
        --medium-large-font: 43px;
        --medium-big-font: 35px;
        --big-font: 30px;
        --medium-font: 23px;
        --small-font: 18px;
        --very-small-font: 15px;
        --mini-font: 8px;
        --mega-mini-font: 5px;

        --dot-font: 35px;
        --a-font: 20px;






    /* =======================
       Colors
       ======================= */

    /* Hero Section */
    --hero-bg: var(--light-bg);
    --hero-basic-color: var(--basic-text-color);

    /* Vision Section */
    --vision-bg: var(--dark-bg);
    --vision-basic-color: var(--basic-text-color);

    /* Our Offer Section */
    --ourOffer-bg: var(--dark-bg);
    --ourOffer-basic-color: var(--basic-text-color);
    --ourOffer-heading: var(--heading-text-color);
    --ourOfferSquare-basic-color: var(--basic-text-color);
    --ourOfferSquare-heading-color: var(--basic-text-color);

    /* How It Works */
    --howItWorks-bg: var(--light-bg);
    --howItWorks-basic-color: var(--basic-text-color);
    --howItWorks-accent-color: var(--geon-primary);

    /* Contact */
    --contact-heading-color: var(--basic-text-color);
    --contact-basic-color: var(--basic-text-color);
    
    --footer-bg-color: var(--geon-primary); /* Footer background color */
    --footer-link-color: white; /* Link color */
    --footer-link-hover-color: var(--geon-secondary); /* Link color on hover */
    --footer-copyright-color: #ffffff; /* Copyright text color */


    

 
    /* =======================
       Margins & Paddings
       ======================= */
    --info-box-padding: 150px 175px; /* Margin for info boxes (top and bottom) */
    --footer-margin-top: 20px; /* Margin above links in the footer */
    --footer-copyright-margin-top: 10px; /* Margin above the copyright text */
    --logo-margin: 10px 45%; /* Center images horizontally */


    /* =======================
       Sizes
       ======================= */
    --info-box-height: 220px;
    --data-rectangle-height: 360px;
    --circle-size: 15px;
}



@font-face {
    font-family: "Acumin-Regular";
    src: url("./AcuminPro/Acumin Pro Book.otf");
}

@font-face {
    font-family: "Acumin-Black";
    src: url("./AcuminPro/Acumin Pro Black.otf");
}

@font-face {
    font-family: "Acumin-UltraBlack";
    src: url("./AcuminPro/Acumin\ Pro\ UltraBlack.otf");
}

@font-face {
    font-family: "Acumin-Bold";
    src: url("./AcuminPro/Acumin Pro Bold.otf");
}

@font-face {
    font-family: "Acumin-Light";
    src: url("./AcuminPro/Acumin Pro ExtraLight.otf");
}

@font-face {
    font-family: "Acumin-Thin";
    src: url("./AcuminPro/Acumin\ Pro\ Thin.otf");
}

@font-face {
    font-family: "Acumin-Italic";
    src: url("./AcuminPro/Acumin\ Pro\ Book\ Italic.otf");
}



h1, h2, h4, h5 {
    font-family: Acumin-Regular;
}






/* =======================
   Footer Section Styles
   ======================= */
   

footer {
    height: 100px;
    background-color: var(--footer-bg-color);
    display: flex;
    text-align: center;
    flex-direction: column; /* Stack footer content vertically */
}

.links {
    margin-top: var(--footer-margin-top);
}

.links > a {
    text-decoration: none; /* Remove underline from links */
    font-family: Acumin-Regular;
    color: var(--footer-link-color); /* Link color */
    padding: 0 10px; /* Space between links */
}

.links > a:hover {
    color: var(--footer-link-hover-color); /* Link color on hover */
}

.copyright {
    color: var(--footer-copyright-color);
    margin-top: var(--footer-copyright-margin-top);
    font-family: Acumin-Light
}

.textBox { 
    justify-self: center;
    align-self: center;
    margin: var(--text-box-margin);
    text-align: center;
}


.infoContainer {
    padding: var(--info-box-padding); /* Margin above and below the info boxes */
}

.PTsection {
    margin-bottom: 30px;
}





/* =======================
    Animation Style
   ======================= */
/* General Styling */
#langEN, #langDE {
    color: black;
    font-weight: normal;
    transition: font-weight 0.3s ease-in-out; /* Smooth transition for text weight */
}

/* Switch Styling */
.form-check-input {
    transition: all 0.4s ease-in-out; /* Smooth transition for the switch */
}

/* Dropdown opens on hover */
.nav-item.dropdown:hover .dropdown-menu {
    display: block;
    margin-top: 0; /* Optional: adjust to avoid any visual jump */
}









html, body {
    scroll-behavior: smooth;
    background-color: var(--light-bg);
}




h1 {
    font-family: Acumin-Black;
    color: var(--ourOffer-heading);
    font-size: var(--medium-big-font);
    text-transform: uppercase;
}

h2 {
    font-size: var(--big-font);
}

h3 {
    font-family: Acumin-Regular;
    font-size: var(--small-font);
}

h4 {
    font-family: Acumin-Light;
    font-size: var(--medium-font);
}


a {
    text-decoration: none;
}



/* Extra Small Devices (Phones, up to 480px) */
@media only screen and (max-width: 480px) {
    h1 {
        font-size: var(--medium-big-font);
    }
}

  
/* Small Devices (Portrait Tablets and Small Phones, up to 768px) */
@media only screen and (min-width: 481px) and (max-width: 768px) {
    h1 {
        font-size: var(--medium-big-font);
    }
}


/* Medium Devices (Tablets in Landscape, 768px to 1024px) */
@media only screen and (min-width: 769px) and (max-width: 1024px) {

}   


/* Large Devices (Desktops, 1024px to 1200px) */
@media only screen and (min-width: 1025px) and (max-width: 1200px) {

}


h6 {
    margin: 1em 0;
    font-size: 1em;
    font-weight: normal;
    line-height: 1.5;
    display: block;
  }