/* Styles globaux */
 body, html {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: #000;
}
#model-container {
    width: 100%;
    height: 100%;
}
.overlay {
    position: absolute;
    top: 20px;
    left: 20px;
    color: white;
    font-size: 24px;
    z-index: 10;
}

/* Style du nav */
nav {
    display: flex;
    justify-content: space-around;
    padding: 15px 60px;
}
nav a {
    position: relative;
    color: #999;
    text-decoration: none;
    font-size: 0.9em;
    z-index: 2;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 20px;
    transition: 0.5s;
}
nav a:active {
    color: #222327;
}
#indicator {
    position: absolute;
    height: 75px;
    width: 150px;
    background: #29fd53;
    z-index: 1;
    transition: 0.5s;
    display: none;
}

/* Animations et styles pour les bordures */
.box {
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.25);
    animation: border-angle-rotate 2s infinite linear;
    border: 2px solid transparent;
}
.box.a {
    background: transparent;
    border-image: conic-gradient(
        from var(--border-angle),
        #000000 0deg,
        #1a1a1a 45deg,
        #333333 90deg,
        #4d4d4d 135deg,
        #666666 180deg,
        #808080 225deg,
        #999999 270deg,
        #b3b3b3 315deg,
        #cccccc 360deg
    ) 1;
    border-image-slice: 1;
}
@keyframes border-angle-rotate {
    from { --border-angle: 0deg; }
    to { --border-angle: 360deg; }
}
@property --border-angle {
    syntax: "<angle>";
    initial-value: 0deg;
    inherits: false;
}
a:hover {
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.25);
    animation: border-angle-rotate 2s infinite linear;
    border: 2px solid transparent;
    background: transparent;
    border-image: conic-gradient(
        from var(--border-angle),
        #000000 0deg,
        #1a1a1a 45deg,
        #333333 90deg,
        #4d4d4d 135deg,
        #666666 180deg,
        #808080 225deg,
        #999999 270deg,
        #b3b3b3 315deg,
        #cccccc 360deg
    ) 1;
    border-image-slice: 1;
    padding-right: 20px;
}

/* Style et animation pour le h1 */