/* ========================= */
/* GLOBAL - PRÊT FEU GO */
/* ========================= */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    background:#080808;
    color:#F5EFE4;
    font-family:Arial, Helvetica, sans-serif;
    overflow-x:hidden;
}

body::selection{
    background:#D6A84F;
    color:#080808;
}

header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:24px 80px;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    z-index:1000;
    background:rgba(8,8,8,0.88);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    border-bottom:1px solid rgba(214,168,79,0.12);
}

.logo{
    color:#D6A84F;
    font-size:28px;
    font-weight:bold;
    letter-spacing:1px;
    text-decoration:none;
}

nav{
    display:flex;
    gap:32px;
}

nav a{
    color:#F5EFE4;
    text-decoration:none;
    font-size:17px;
    transition:color .25s ease;
}

nav a:hover,
nav a.active{
    color:#D6A84F;
}

.btn-primary{
    display:inline-block;
    background:#D6A84F;
    color:#080808;
    text-decoration:none;
    padding:16px 32px;
    font-weight:bold;
    font-size:18px;
    box-shadow:0 0 35px rgba(214,168,79,0.18);
    transition:transform .25s ease, box-shadow .25s ease;
}

.btn-secondary{
    display:inline-block;
    border:1px solid rgba(214,168,79,0.75);
    color:#D6A84F;
    text-decoration:none;
    padding:16px 32px;
    font-size:18px;
    background:rgba(0,0,0,0.35);
    transition:background .25s ease, transform .25s ease;
}

.btn-primary:hover,
.btn-secondary:hover{
    transform:translateY(-2px);
}

.btn-primary:hover{
    box-shadow:0 0 45px rgba(214,168,79,0.26);
}

.btn-secondary:hover{
    background:rgba(214,168,79,0.08);
}

.section-title{
    text-align:center;
    margin-bottom:60px;
}

.section-title span,
.page-hero-content span{
    display:block;
    color:#D6A84F;
    font-size:14px;
    letter-spacing:3px;
    margin-bottom:18px;
}

.section-title h2{
    font-size:36px;
    margin-bottom:15px;
}

.section-title p{
    color:#B8B0A4;
    font-size:18px;
}


/* ========================= */
/* HERO PAGES INTERNES */
/* ========================= */

.page-hero{
    min-height:72vh;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:155px 40px 90px;
    position:relative;
    overflow:hidden;
    background:
        linear-gradient(180deg, rgba(8,8,8,0.56) 0%, rgba(8,8,8,0.86) 58%, rgba(8,8,8,1) 100%),
        linear-gradient(90deg, rgba(8,8,8,0.94) 0%, rgba(8,8,8,0.72) 46%, rgba(8,8,8,0.46) 100%),
        url("../img/Hero-forge.png");
    background-size:cover;
    background-position:center center;
}

.page-hero::after{
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(circle at 50% 45%, rgba(214,168,79,0.10), transparent 34%);
    pointer-events:none;
}

.page-hero-content{
    max-width:920px;
    margin:0 auto;
    position:relative;
    z-index:2;
}

.page-hero-content span{
    display:block;
    color:#D6A84F;
    font-size:14px;
    letter-spacing:4px;
    text-transform:uppercase;
    margin-bottom:22px;
}

.page-hero h1{
    color:#D6A84F;
    font-size:72px;
    line-height:1.08;
    margin-bottom:24px;
    letter-spacing:1px;
    text-shadow:0 0 35px rgba(214,168,79,0.18);
}

.page-hero h2{
    color:#F5EFE4;
    font-size:40px;
    line-height:1.18;
    margin-bottom:24px;
    text-shadow:0 8px 25px rgba(0,0,0,0.68);
}

.page-hero p{
    color:#D8D0C5;
    font-size:21px;
    line-height:1.65;
    max-width:780px;
    margin:0 auto;
    text-shadow:0 8px 25px rgba(0,0,0,0.68);
}


/* ========================= */
/* ACCUEIL */
/* ========================= */

.hero{
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:90px;
    padding:110px 80px 40px;
    position:relative;
    background:
        linear-gradient(90deg, rgba(8,8,8,0.96) 0%, rgba(8,8,8,0.82) 38%, rgba(8,8,8,0.42) 100%),
        linear-gradient(180deg, rgba(8,8,8,0.15) 0%, rgba(8,8,8,0.90) 100%),
        url("../img/Hero-forge.png");
    background-size:cover;
    background-position:center;
}

.hero-content{
    max-width:720px;
    position:relative;
    z-index:2;
}

.hero h1{
    font-size:72px;
    color:#D6A84F;
    margin-bottom:25px;
    letter-spacing:1px;
    text-shadow:0 0 30px rgba(214,168,79,0.20);
}

.hero h2{
    font-size:42px;
    margin-bottom:35px;
    white-space:nowrap;
    text-shadow:0 8px 25px rgba(0,0,0,0.70);
}

.hero p{
    font-size:22px;
    line-height:1.6;
    color:#D8D0C5;
    text-shadow:0 8px 25px rgba(0,0,0,0.75);
}

.hero-buttons{
    margin-top:45px;
    display:flex;
    gap:22px;
}

.hero-phone{
    position:relative;
    z-index:2;
}

.hero-phone::before{
    content:"";
    position:absolute;
    width:580px;
    height:580px;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    background:#D6A84F;
    opacity:0.18;
    filter:blur(140px);
    border-radius:50%;
    z-index:-1;
}

.hero-phone img{
    width:400px;
    height:auto;
    display:block;
    filter:
        drop-shadow(0 45px 80px rgba(0,0,0,0.85))
        drop-shadow(0 0 35px rgba(214,168,79,0.18));
}

.philosophy{
    display:grid;
    grid-template-columns:1fr 2fr 1fr;
    gap:40px;
    align-items:center;
    padding:70px 80px;
    border-top:1px solid rgba(214,168,79,0.15);
    border-bottom:1px solid rgba(214,168,79,0.15);
    background:linear-gradient(180deg, #0B0B0B, #080808);
    text-align:center;
}

.philosophy-center span{
    display:block;
    color:#D6A84F;
    font-size:14px;
    letter-spacing:3px;
    margin-bottom:18px;
}

.philosophy-center h2{
    font-size:30px;
    line-height:1.4;
    margin-bottom:20px;
}

.philosophy-center strong{
    color:#D6A84F;
}

.philosophy-center p,
.philosophy-side p{
    color:#B8B0A4;
    line-height:1.6;
}

.philosophy-side{
    padding:20px;
}

.philosophy-side:first-child{
    border-right:1px solid rgba(214,168,79,0.18);
}

.philosophy-side:last-child{
    border-left:1px solid rgba(214,168,79,0.18);
}

.philosophy-icon{
    color:#D6A84F;
    font-size:48px;
    margin-bottom:15px;
}

.philosophy-side h3{
    color:#D6A84F;
    letter-spacing:2px;
    margin-bottom:12px;
}

.home-app-preview{
    padding:90px 70px;
    background:#080808;
}

.preview-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:28px;
    max-width:1100px;
    margin:0 auto;
}

.preview-card{
    border:1px solid rgba(214,168,79,0.22);
    background:linear-gradient(180deg, rgba(214,168,79,0.06), rgba(255,255,255,0.02));
    padding:36px;
    text-align:center;
}

.preview-card h3{
    color:#D6A84F;
    letter-spacing:2px;
    margin-bottom:15px;
}

.preview-card p{
    color:#B8B0A4;
    line-height:1.6;
}

.center-button{
    text-align:center;
    margin-top:45px;
}

/* ========================= */
/* FOOTER GLOBAL */
/* ========================= */

.site-footer{
    background:#050505;
    border-top:1px solid rgba(214,168,79,0.16);
    padding:56px 30px 42px;
    text-align:center;
}

.footer-content{
    max-width:900px;
    margin:0 auto;
}

.footer-content h3{
    color:#D6A84F;
    font-size:26px;
    letter-spacing:2px;
    margin-bottom:12px;
}

.footer-motto{
    color:#F5EFE4;
    font-size:17px;
    margin-bottom:28px;
}

.footer-legal{
    display:flex;
    justify-content:center;
    align-items:center;
    flex-wrap:wrap;
    gap:18px 28px;
    margin-bottom:26px;
}

.footer-legal a{
    color:#B8B0A4;
    text-decoration:none;
    font-size:15px;
    transition:color .25s ease;
}

.footer-legal a:hover{
    color:#D6A84F;
}

.footer-copy{
    color:#7D766E;
    font-size:14px;
}

/* ========================= */
/* PAGES LÉGALES */
/* ========================= */

.legal-page{
    background:#080808;
    color:#F5EFE4;
}

.legal-hero{
    min-height:46vh;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:145px 30px 70px;
    background:
        linear-gradient(180deg, rgba(8,8,8,0.62), rgba(8,8,8,1)),
        url("../img/Hero-forge.png");
    background-size:cover;
    background-position:center;
}

.legal-hero-content{
    max-width:850px;
    margin:0 auto;
}

.legal-hero span{
    display:block;
    color:#D6A84F;
    font-size:14px;
    letter-spacing:4px;
    margin-bottom:20px;
}

.legal-hero h1{
    color:#D6A84F;
    font-size:54px;
    line-height:1.1;
    margin-bottom:18px;
}

.legal-hero p{
    color:#D8D0C5;
    font-size:19px;
    line-height:1.6;
}

.legal-content{
    max-width:980px;
    margin:0 auto;
    padding:80px 30px 105px;
}

.legal-card{
    border:1px solid rgba(214,168,79,0.22);
    background:
        radial-gradient(circle at top left, rgba(214,168,79,0.08), transparent 32%),
        linear-gradient(180deg, rgba(214,168,79,0.045), rgba(255,255,255,0.014));
    padding:48px;
    box-shadow:0 35px 90px rgba(0,0,0,0.45);
}

.legal-card section + section{
    margin-top:40px;
    padding-top:34px;
    border-top:1px solid rgba(214,168,79,0.13);
}

.legal-card h2{
    color:#D6A84F;
    font-size:26px;
    margin-bottom:18px;
}

.legal-card p,
.legal-card li{
    color:#D8D0C5;
    font-size:17px;
    line-height:1.75;
}

.legal-card ul{
    padding-left:22px;
}

.legal-card a{
    color:#D6A84F;
    text-decoration:none;
}

.legal-card a:hover{
    text-decoration:underline;
}

.legal-muted{
    color:#9F978C !important;
    font-size:15px !important;
    margin-top:18px;
}

/* ========================= */
/* MOBILE GLOBAL */
/* ========================= */

@media (max-width:768px){

    .page-hero{
        min-height:auto;
        padding:175px 24px 82px;
        background-position:center;
    }

    .page-hero h1{
        font-size:46px;
    }

    .page-hero h2{
        font-size:28px;
    }

    .page-hero p{
        font-size:18px;
    }

    .page-hero-content span{
        font-size:13px;
        letter-spacing:3px;
    }


    header{
        padding:18px 22px;
        position:fixed;
        flex-direction:column;
        align-items:flex-start;
        gap:15px;
        background:rgba(8,8,8,0.92);
    }

    .logo{
        font-size:28px;
        line-height:1.1;
    }

    nav{
        width:100%;
        gap:12px 16px;
        flex-wrap:wrap;
    }

    nav a{
        font-size:14px;
        line-height:1.2;
    }

    .hero{
        flex-direction:column;
        text-align:center;
        padding:180px 25px 70px;
        gap:50px;
    }

    .hero h1{
        font-size:46px;
    }

    .hero h2{
        font-size:29px;
        white-space:normal;
    }

    .hero p{
        font-size:18px;
    }

    .hero-buttons{
        justify-content:center;
        flex-direction:column;
        align-items:center;
    }

    .btn-primary,
    .btn-secondary{
        width:100%;
        max-width:360px;
        text-align:center;
    }

    .hero-phone img{
        width:min(310px, 85vw);
    }

    .hero-phone::before{
        width:390px;
        height:390px;
    }

    .philosophy{
        grid-template-columns:1fr;
        padding:60px 25px;
    }

    .philosophy-side{
        border:none !important;
    }

    .philosophy-center h2{
        font-size:24px;
    }

    .home-app-preview{
        padding:70px 25px;
    }

    .section-title h2{
        font-size:28px;
    }

    .preview-grid{
        grid-template-columns:1fr;
    }

    .site-footer{
        padding:48px 24px 34px;
    }

    .footer-content h3{
        font-size:24px;
    }

    .footer-legal{
        flex-direction:column;
        gap:12px;
    }

    .legal-hero{
        min-height:auto;
        padding:175px 24px 70px;
    }

    .legal-hero h1{
        font-size:38px;
    }

    .legal-hero p{
        font-size:17px;
    }

    .legal-content{
        padding:60px 24px 82px;
    }

    .legal-card{
        padding:32px 24px;
    }

    .legal-card h2{
        font-size:23px;
    }

    .legal-card p,
    .legal-card li{
        font-size:16px;
    }
}


@media (max-width:430px){

    .page-hero{
        padding:170px 20px 72px;
    }

    .page-hero h1{
        font-size:40px;
    }

    .page-hero h2{
        font-size:25px;
    }


    header{
        padding:20px 18px;
    }

    .logo{
        font-size:25px;
    }

    nav{
        gap:10px 13px;
    }

    nav a{
        font-size:13px;
    }

    .hero{
        padding:175px 20px 64px;
    }

    .hero h1{
        font-size:40px;
    }

    .hero h2{
        font-size:25px;
    }

    .hero p{
        font-size:17px;
    }

    .footer-content h3{
        font-size:22px;
    }
}



/* ========================= */
/* LIEN CONFIDENTIALITÉ APPLICATION */
/* ========================= */

.application-privacy-shortcut{
    max-width:1180px;
    margin:0 auto;
    padding:18px 30px 26px;
    text-align:right;
}

.application-privacy-shortcut a{
    display:inline-block;
    color:#8F887F;
    text-decoration:none;
    font-size:13px;
    line-height:1.4;
    padding:8px 0;
    border-bottom:1px solid rgba(214,168,79,0.22);
    transition:color .25s ease, border-color .25s ease;
}

.application-privacy-shortcut a:hover{
    color:#D6A84F;
    border-color:rgba(214,168,79,0.60);
}

@media (max-width:768px){
    .application-privacy-shortcut{
        padding:16px 22px 22px;
        text-align:center;
    }

    .application-privacy-shortcut a{
        font-size:12px;
    }
}