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

html, body {
    height: 100%;
}

/* =====================
   BASE
===================== */
body {
    font-family: "Georgia", "Times New Roman", serif;
    background: radial-gradient(
        ellipse at top,
        #1c1a17 0%,
        #0b0b0b 55%,
        #000 100%
    );
    color: #eae7e2;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow-x: hidden;
}

/* =====================
   TOP LIGHT (point + diffusion)
   au bord du cadre
   neutre / élégant
===================== */
body::before {
    content:"";
    position:absolute;
    top:0;
    left:50%;
    transform:translateX(-50%);
    width:72%;
    height:2px;

    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(235,220,190,0.10) 30%,
        rgba(235,220,190,0.35) 50%,
        rgba(235,220,190,0.10) 70%,
        transparent 100%
    );

    box-shadow:
        0 0 8px  rgba(235,220,190,0.18),
        0 0 22px rgba(235,220,190,0.12),
        0 0 60px rgba(235,220,190,0.08);

    opacity:0.65;
    pointer-events:none;
    z-index:999;
}

body::after {
    content:"";
    position:absolute;
    top:-10px;
    left:50%;
    transform:translateX(-50%);
    width:70%;
    height:42vh;

    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(255,245,220,0.35) 0%,
            rgba(255,245,220,0.18) 7%,
            rgba(255,245,220,0.08) 16%,
            rgba(255,245,220,0.00) 34%
        ),
        radial-gradient(
            ellipse at 50% 0%,
            rgba(235,220,190,0.10) 0%,
            rgba(235,220,190,0.05) 22%,
            rgba(235,220,190,0.00) 58%
        );

    filter: blur(10px);
    opacity:0.55;
    pointer-events:none;
    z-index:998;
}

/* =====================
   HEADER
===================== */
.site-header {
    padding: 32px 48px;
    position: relative;
    z-index: 2;
}

.brand {
    font-size: 14px;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    opacity: 0.85;
}

/* =====================
   HERO
===================== */
.hero {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 40px 20px;
    position: relative;
    z-index: 2;
}

.hero h1 {
    font-size: clamp(2.5rem, 5vw, 4.2rem);
    font-weight: 400;
    margin-bottom: 24px;
}

.subtitle {
    max-width: 720px;
    font-size: 1.1rem;
    line-height: 1.7;
    opacity: 0.78;
    margin-bottom: 40px;
}

/* =====================
   STATUS
===================== */
.status {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 0.95rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #c5a46d;
}

.dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #c5a46d;
}

/* =====================
   FOOTER
===================== */
.site-footer {
    padding: 32px 20px;
    text-align: center;
    font-size: 0.9rem;
    opacity: 0.7;
    position: relative;
    z-index: 2;
}

/* =====================
   RESPONSIVE
===================== */
@media (max-width: 640px) {
    .site-header {
        padding: 26px 22px;
    }
    .brand {
        letter-spacing: 0.22em;
    }
    body::before {
        width: 80%;
    }
    body::after {
        width: 85%;
        height: 36vh;
    }
}



/* =====================
   MANUEL PRIVE (page cachée)
   Ajouts non-invasifs : ne touchent pas au design du landing.
===================== */
.manual-page .hero {
    justify-content: flex-start;
    padding-top: 70px;
    padding-bottom: 70px;
}

.manual {
    width: min(860px, 100%);
    text-align: left;
    margin-top: 18px;
}

.manual h1 {
    font-size: clamp(2.0rem, 4vw, 3.2rem);
    font-weight: 400;
    margin-bottom: 18px;
}

.manual h2 {
    font-size: 1.15rem;
    font-weight: 400;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #c5a46d;
    margin-top: 34px;
    margin-bottom: 10px;
}

.manual p, .manual li {
    font-size: 1.02rem;
    line-height: 1.75;
    opacity: 0.82;
}

.manual ul {
    margin: 10px 0 0 18px;
}

.manual hr {
    border: none;
    border-top: 1px solid rgba(234,231,226,0.10);
    margin: 26px 0;
}

.access-denied {
    max-width: 720px;
    opacity: 0.78;
}

.access-denied .status {
    margin-top: 22px;
    justify-content: center;
}