/* ============================================================
   home.css — landing page publique
   ============================================================ */

/* ── Reset / base ─────────────────────────────────────────── */

.page-home {
    margin:      0;
    background:  #0e0b09;
    color:       #ebdcb9;
    font-family: 'Crimson Text', Georgia, serif;
    font-size:   1.1rem;
    line-height: 1.6;
}

.page-home main {
    display:        flex;
    flex-direction: column;
}

/* ── Topbar (home-specific overrides) ────────────────────── */

/* Language switch link */
.home-topbar__lang {
    font-family:     'Cinzel', serif;
    font-size:       0.75rem;
    color:           #8b7355;
    text-decoration: none;
    letter-spacing:  1px;
    text-transform:  uppercase;
    transition:      color 0.2s;
}
.home-topbar__lang:hover { color: #c8a870; }

/* Register CTA button override (orange tint on rustic base) */
.home-btn--primary {
    background: linear-gradient(to bottom, #7a3a00 0%, #4a2200 100%);
    border:     1px solid #a05020;
    color:      #f4d080;
    box-shadow: 0 2px 8px rgba(0,0,0,0.5);
}
.home-btn--primary:hover {
    background: linear-gradient(to bottom, #9a4a00 0%, #6a3000 100%);
    color:      #ffe0a0;
    box-shadow: 0 4px 14px rgba(160,80,0,0.3);
}

/* Hero CTA buttons */
.home-btn {
    font-family:     'Cinzel', serif;
    font-size:       0.82rem;
    font-weight:     700;
    text-transform:  uppercase;
    letter-spacing:  1px;
    text-decoration: none;
    border-radius:   3px;
    padding:         8px 18px;
    cursor:          pointer;
    transition:      all 0.2s;
    white-space:     nowrap;
    display:         inline-block;
}

.home-btn--lg {
    font-size: 0.95rem;
    padding:   12px 32px;
}

/* ── Section shared ───────────────────────────────────────── */

.home-section-inner {
    max-width: 960px;
    margin:    0 auto;
    padding:   0 24px;
    width:     100%;
    box-sizing: border-box;
}

.home-section-title {
    font-family:    'Cinzel', serif;
    font-size:      1.6rem;
    font-weight:    700;
    color:          #f4d080;
    letter-spacing: 2px;
    margin:         0 0 28px;
    text-align:     center;
}

/* ── Hero ─────────────────────────────────────────────────── */

.home-hero {
    min-height:      calc(100vh - 70px);
    display:         flex;
    align-items:     center;
    justify-content: center;
    gap:             60px;
    padding:         80px 40px;
    box-sizing:      border-box;
    background:
        radial-gradient(ellipse at 30% 50%, rgba(80,40,0,0.18) 0%, transparent 60%),
        linear-gradient(to bottom, rgba(14,11,9,0.82) 0%, rgba(18,16,13,0.92) 100%),
        url('/images/point-crawl-maker-fond.webp') center/cover no-repeat;
}

.home-hero__content {
    flex:      1;
    max-width: 520px;
}

.home-hero__seo-h1 {
    font-family:    'Cinzel', serif;
    font-size:      0.8rem;
    font-weight:    400;
    color:          #cdbba9;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin:         0 0 16px;
}

.home-hero__title {
    font-family:    'Cinzel', serif;
    font-size:      clamp(2rem, 4vw, 3rem);
    font-weight:    700;
    color:          #f4ebd8;
    line-height:    1.2;
    letter-spacing: 2px;
    margin:         0 0 24px;
}

.home-hero__subtitle {
    font-size:   1.2rem;
    color:       #c8b693;
    margin:      0 0 36px;
    line-height: 1.7;
}

.home-hero__actions {
    display:     flex;
    align-items: center;
    gap:         20px;
    flex-wrap:   wrap;
}

.home-hero__note {
    font-family: 'Crimson Text', serif;
    font-style:  italic;
    font-size:   0.95rem;
    color:       #6b5842;
}

.home-hero__visual {
    flex:      1;
    max-width: 480px;
    width:     100%;
}

.home-hero__video {
    position:      relative;
    width:         100%;
    padding-top:   56.25%; /* 16:9 */
    border:        1px solid rgba(107,88,66,0.35);
    border-radius: 4px;
    overflow:      hidden;
    box-shadow:    0 8px 40px rgba(0,0,0,0.6);
}

.home-hero__video iframe {
    position: absolute;
    inset:    0;
    width:    100%;
    height:   100%;
}

/* ── What is a point crawl ────────────────────────────────── */

.home-what {
    padding:    80px 40px;
    background: #0a0806;
    border-top: 1px solid rgba(107,88,66,0.2);
}

.home-what__body {
    font-size:   1.15rem;
    color:       #c8b693;
    max-width:   680px;
    margin:      0 auto 48px;
    text-align:  center;
    line-height: 1.8;
}

/* Videos */

.home-videos__intro {
    font-family: 'Crimson Text', serif;
    font-style:  italic;
    font-size:   1rem;
    color:       #6b5842;
    text-align:  center;
    margin:      0 0 20px;
}

.home-videos__grid {
    display:               grid;
    grid-template-columns: repeat(3, 1fr);
    gap:                   20px;
}

.home-video {
    position:    relative;
    width:       100%;
    padding-top: 56.25%; /* 16:9 */
    background:  #0a0806;
    border:      1px solid rgba(107,88,66,0.25);
    border-radius: 3px;
    overflow:    hidden;
}

.home-video iframe {
    position: absolute;
    inset:    0;
    width:    100%;
    height:   100%;
}

/* ── Screenshots ──────────────────────────────────────────── */

.home-screenshots {
    padding:    80px 40px;
    background: #0e0b09;
    border-top: 1px solid rgba(107,88,66,0.2);
}

.home-screenshots__strip {
    display:   grid;
    grid-template-columns: repeat(2, 1fr);
    gap:       24px;
    margin-top: 8px;
}

.home-screenshot {
    margin: 0;
}

.home-screenshot__frame {
    border:        1px solid rgba(107,88,66,0.3);
    border-radius: 4px;
    overflow:      hidden;
    background:    #0a0806;
    aspect-ratio:  20 / 9;
}

.home-screenshot__frame img {
    width:      100%;
    height:     100%;
    object-fit: cover;
    display:    block;
}

.home-screenshot__placeholder {
    width:           100%;
    height:          100%;
    display:         flex;
    flex-direction:  column;
    align-items:     center;
    justify-content: center;
    gap:             12px;
    color:           rgba(107,88,66,0.4);
    font-family:     'Cinzel', serif;
    font-size:       0.65rem;
    letter-spacing:  1px;
    text-transform:  uppercase;
}

.home-screenshot figcaption {
    font-family:    'Cinzel', serif;
    font-size:      0.72rem;
    color:          #6b5842;
    letter-spacing: 1px;
    text-transform: uppercase;
    text-align:     center;
    margin-top:     10px;
}

/* ── Features ─────────────────────────────────────────────── */

.home-features {
    padding:    80px 40px;
    background: #0e0b09;
    border-top: 1px solid rgba(107,88,66,0.2);
}

.home-features__grid {
    display:               grid;
    grid-template-columns: repeat(2, 1fr);
    gap:                   28px;
}

.home-feat-card {
    background:    rgba(255,255,255,0.03);
    border:        1px solid rgba(107,88,66,0.25);
    border-radius: 4px;
    padding:       28px 28px 24px;
    transition:    border-color 0.2s, background 0.2s;
}

.home-feat-card:hover {
    border-color: rgba(200,168,80,0.35);
    background:   rgba(255,255,255,0.05);
}

.home-feat-card__icon {
    color:         #c8a870;
    margin-bottom: 16px;
}

.home-feat-card__title {
    font-family:    'Cinzel', serif;
    font-size:      0.95rem;
    font-weight:    700;
    color:          #f4d080;
    letter-spacing: 1px;
    margin:         0 0 10px;
    text-transform: uppercase;
}

.home-feat-card__body {
    font-size:   1.05rem;
    color:       #a89070;
    margin:      0;
    line-height: 1.65;
}

/* ── Desktop / Mobile ────────────────────────────────────── */

.home-deskmob {
    padding:    80px 40px;
    background: #0a0806;
    border-top: 1px solid rgba(107,88,66,0.2);
}

.home-deskmob__lead {
    font-family: 'Crimson Text', serif;
    font-size:   1.2rem;
    color:       #c8b693;
    max-width:   660px;
    margin:      0 auto 48px;
    text-align:  center;
    line-height: 1.8;
}

.home-deskmob__cols {
    display:         flex;
    align-items:     flex-start;
    justify-content: center;
    gap:             0;
    max-width:       760px;
    margin:          0 auto;
}

.home-deskmob__col {
    flex:       1;
    text-align: center;
    padding:    0 32px;
}

.home-deskmob__divider {
    color:       #4a3a2a;
    font-size:   1.8rem;
    padding-top: 44px;
    flex-shrink: 0;
    line-height: 1;
}

.home-deskmob__icon {
    color:         #c8a870;
    margin-bottom: 16px;
}

.home-deskmob__col-title {
    font-family:    'Cinzel', serif;
    font-size:      0.9rem;
    font-weight:    700;
    color:          #f4d080;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin:         0 0 10px;
}

.home-deskmob__col-body {
    font-family: 'Crimson Text', serif;
    font-size:   1.05rem;
    color:       #a89070;
    line-height: 1.7;
    margin:      0;
}

/* ── Who am I ─────────────────────────────────────────────── */

.home-about {
    padding:    80px 40px;
    background: #0e0b09;
    border-top: 1px solid rgba(107,88,66,0.2);
}

.home-about__card {
    display:     flex;
    align-items: flex-start;
    gap:         48px;
    max-width:   760px;
    margin:      0 auto;
}

.home-about__avatar {
    flex-shrink: 0;
    width:       180px;
}

.home-about__portrait {
    width:   100%;
    height:  auto;
    display: block;
}

.home-about__text {
    flex: 1;
}

.home-about__title {
    font-family:    'Cinzel', serif;
    font-size:      1.3rem;
    font-weight:    700;
    color:          #f4d080;
    letter-spacing: 2px;
    margin:         0 0 18px;
}

.home-about__text p {
    font-family: 'Crimson Text', serif;
    font-size:   1.1rem;
    color:       #c8b693;
    line-height: 1.8;
    margin:      0 0 14px;
}

.home-about__text p:last-child { margin-bottom: 0; }

/* ── FAQ ──────────────────────────────────────────────────── */

.home-faq {
    padding:    80px 40px;
    background: #0a0806;
    border-top: 1px solid rgba(107,88,66,0.2);
}

.home-faq__list {
    max-width:  680px;
    margin:     0 auto;
}

.home-faq__item {
    border-bottom: 1px solid rgba(107,88,66,0.2);
}

.home-faq__item:last-child { border-bottom: none; }

.home-faq__q {
    font-family:    'Cinzel', serif;
    font-size:      0.88rem;
    font-weight:    700;
    color:          #c8b693;
    letter-spacing: 0.5px;
    padding:        18px 28px 18px 0;
    cursor:         pointer;
    list-style:     none;
    display:        flex;
    align-items:    center;
    justify-content: space-between;
    user-select:    none;
    transition:     color 0.2s;
}

.home-faq__q::-webkit-details-marker { display: none; }

.home-faq__q::after {
    content:    '+';
    font-family: 'Cinzel', serif;
    font-size:  1.1rem;
    color:      #6b5842;
    flex-shrink: 0;
    transition: transform 0.2s, color 0.2s;
}

.home-faq__item[open] > .home-faq__q {
    color: #f4d080;
}

.home-faq__item[open] > .home-faq__q::after {
    content:   '−';
    color:     #c8a870;
}

.home-faq__q:hover { color: #ebdcb9; }

.home-faq__a {
    font-family: 'Crimson Text', serif;
    font-size:   1.05rem;
    color:       #a89070;
    line-height: 1.7;
    padding:     0 0 18px;
    margin:      0;
}

.home-faq__a p {
    margin: 0 0 10px;
}

.home-faq__a p:last-child { margin-bottom: 0; }

/* ── Blog récent ──────────────────────────────────────────── */

.home-blog {
    padding:    80px 40px;
    background: #0e0b09;
    border-top: 1px solid rgba(107,88,66,0.2);
}

.home-section-desc {
    font-family: 'Crimson Text', serif;
    font-size:   1.1rem;
    color:       #a89070;
    text-align:  center;
    margin:      -16px auto 36px;
    line-height: 1.6;
    max-width:   520px;
}

.home-blog__track-wrap {
    display:     flex;
    align-items: center;
    gap:         12px;
}

.home-blog__track {
    display:            flex;
    gap:                24px;
    overflow-x:         auto;
    scroll-snap-type:   x mandatory;
    scroll-behavior:    smooth;
    -ms-overflow-style: none;
    scrollbar-width:    none;
    flex:               1;
    padding:            4px 2px 12px;
}

.home-blog__track::-webkit-scrollbar { display: none; }

.home-blog__card {
    flex:             0 0 300px;
    scroll-snap-align: start;
    background:       rgba(244,235,216,0.04);
    border:           1px solid rgba(107,88,66,0.3);
    border-radius:    4px;
    padding:          24px;
    display:          flex;
    flex-direction:   column;
    gap:              10px;
    text-decoration:  none;
    transition:       border-color 0.2s, background 0.2s;
}

.home-blog__card:hover,
.home-blog__card:focus {
    text-decoration: none;
}

.home-blog__card:hover {
    border-color: rgba(200,168,80,0.4);
    background:   rgba(244,235,216,0.07);
}

.home-blog__date {
    font-family:    'Cinzel', serif;
    font-size:      0.72rem;
    color:          #6b5842;
    letter-spacing: 0.5px;
}

.home-blog__card-title {
    font-family: 'Cinzel', serif;
    font-size:   1.05rem;
    color:       #ebdcb9;
    line-height: 1.4;
    font-weight: 700;
}

.home-blog__excerpt {
    font-family: 'Crimson Text', serif;
    font-size:   1rem;
    color:       #a89070;
    line-height: 1.6;
    flex:        1;
}

.home-blog__read {
    font-family:    'Cinzel', serif;
    font-size:      0.75rem;
    color:          #c8a870;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    margin-top:     4px;
}

.home-blog__arrow {
    flex-shrink:     0;
    background:      transparent;
    border:          1px solid rgba(107,88,66,0.4);
    border-radius:   50%;
    width:           36px;
    height:          36px;
    color:           #a89070;
    font-size:       1.1rem;
    cursor:          pointer;
    display:         flex;
    align-items:     center;
    justify-content: center;
    transition:      border-color 0.2s, color 0.2s;
    line-height:     1;
}

.home-blog__arrow:hover {
    border-color: rgba(200,168,80,0.5);
    color:        #c8a870;
}

/* ── CTA final ────────────────────────────────────────────── */

.home-cta {
    padding:    100px 40px;
    background: linear-gradient(to bottom, #0a0806 0%, #0e0b09 100%);
    border-top: 1px solid rgba(107,88,66,0.2);
}

.home-cta__inner {
    display:        flex;
    flex-direction: column;
    align-items:    center;
    gap:            20px;
    text-align:     center;
}

.home-cta__title {
    font-size: 1.9rem;
    margin:    0;
}

.home-cta__login {
    font-family:     'Cinzel', serif;
    font-size:       0.78rem;
    color:           #6b5842;
    text-decoration: none;
    letter-spacing:  1px;
    text-transform:  uppercase;
    transition:      color 0.2s;
}
.home-cta__login:hover { color: #c8a870; }

/* ── Footer ───────────────────────────────────────────────── */

.home-footer {
    display:         flex;
    align-items:     center;
    justify-content: space-between;
    padding:         20px 40px;
    border-top:      1px solid rgba(107,88,66,0.2);
    font-family:     'Cinzel', serif;
    font-size:       0.72rem;
    color:           #6b5540;
    letter-spacing:  1px;
    text-transform:  uppercase;
}

.home-footer__left {
    display:     flex;
    align-items: center;
    gap:         12px;
}

.home-footer__sep {
    color: #5a4530;
}

.home-footer__lang,
.home-footer__legal {
    color:           #6b5842;
    text-decoration: none;
    transition:      color 0.2s;
}
.home-footer__lang:hover,
.home-footer__legal:hover  { color: #c8a870; }
.home-footer__legal--active { color: #c8a870; }

/* ── Legal page content ───────────────────────────────────── */

.legal-content {
    padding:    80px 40px;
    background: #0e0b09;
    border-top: 1px solid rgba(107,88,66,0.2);
    min-height: calc(100vh - 140px);
}

.legal-content__title {
    font-family:    'Cinzel', serif;
    font-size:      1.8rem;
    font-weight:    700;
    color:          #f4d080;
    letter-spacing: 2px;
    margin:         0 0 48px;
    text-align:     center;
}

.legal-block {
    max-width:     680px;
    margin:        0 auto 36px;
    padding-bottom: 36px;
    border-bottom: 1px solid rgba(107,88,66,0.15);
}

.legal-block:last-child {
    border-bottom: none;
    margin-bottom: 0;
}

.legal-block__title {
    font-family:    'Cinzel', serif;
    font-size:      0.82rem;
    font-weight:    700;
    color:          #c8a870;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin:         0 0 12px;
}

.legal-block__body {
    font-family: 'Crimson Text', serif;
    font-size:   1.05rem;
    color:       #a89070;
    line-height: 1.8;
    margin:      0;
}

.legal-block__body a {
    color:                 #c8a870;
    text-decoration:       underline;
    text-underline-offset: 3px;
}

.legal-block__body a:hover { color: #f4d080; }

/* ── Responsive ───────────────────────────────────────────── */

@media (max-width: 768px) {
    .topbar {
        padding: 0 16px;
    }

    .home-hero {
        flex-direction: column;
        padding:        60px 24px;
        min-height:     auto;
        text-align:     center;
    }

    .home-hero__actions {
        justify-content: center;
    }

    .home-hero__visual { max-width: 100%; }

    .home-what,
    .home-screenshots,
    .home-features,
    .home-deskmob,
    .home-about,
    .home-faq,
    .home-blog,
    .home-cta {
        padding: 60px 24px;
    }

    .home-blog__card {
        flex: 0 0 260px;
    }

    .home-videos__grid {
        grid-template-columns: 1fr;
    }

    .home-screenshots__strip {
        grid-template-columns: 1fr;
    }

    .home-features__grid {
        grid-template-columns: 1fr;
    }

    .home-deskmob__cols {
        flex-direction: column;
        align-items:    center;
        gap:            32px;
    }

    .home-deskmob__col { padding: 0; }

    .home-deskmob__divider {
        padding-top: 0;
        transform:   rotate(90deg);
    }

    .home-about__card {
        flex-direction: column;
        align-items:    center;
        gap:            24px;
        text-align:     center;
    }

    .home-footer {
        padding:        16px 24px;
        flex-direction: column;
        gap:            8px;
        text-align:     center;
    }

    .home-footer__left {
        flex-direction: column;
        gap:            6px;
    }
}