/* ==========================================================================
   GÉNÉRATEUR DE THUMBNAIL CSS : PROJET PORTFOLIO
   À utiliser à la place d'une image standard
   Aspect Ratio attendu : 16:9 (via le parent .card-image)
   ========================================================================== */

/* 1. Conteneur principal (Le fond) */
.thumb-generator.portfolio-blueprint {
    width: 100%;
    height: 100%; /* S'adapte au parent .card-image */
    background-color: var(--light, #E8EBE0); /* Ton fond clair */
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* 2. Le motif de fond (Lignes de grille de schéma) */
.portfolio-blueprint .blueprint-lines {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    /* Crée une grille de points verts très subtils */
    background-image: radial-gradient(var(--accent-green, #84A98C) 1px, transparent 1px);
    background-size: 20px 20px;
    opacity: 0.2; /* Très discret */
}

/* 3. L'icône centrale (Symbole de code) */
.portfolio-blueprint .blueprint-icon {
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    font-size: 4rem; /* Très gros */
    position: relative;
    z-index: 3;

    /* --- CORRECTION ICI : Remplissage plein au lieu de l'outline --- */
    color: var(--text-ultra, #2F3E46); /* Utilise votre couleur sombre par défaut */
    /* -webkit-text-stroke retiré */

    opacity: 0.8; /* Conserve une légère transparence pour le style schéma */
}

/* 4. Les blocs filaires flottants (Architecture du site) */
.portfolio-blueprint .blueprint-blocks {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    z-index: 1;
    display: flex;
    flex-direction: column;
    padding: 10%; /* Marge intérieure */
    gap: 8px;
    transform: rotate(-5deg) scale(1.1); /* Légère rotation pour le dynamisme */
    opacity: 0.6;
}

/* Style commun des blocs wireframe */
.portfolio-blueprint .blueprint-blocks div {
    border: 2px solid var(--green, #52796F); /* Ton vert moyen */
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.4); /* Fond semi-blanc bluré */
}

/* Blocs spécifiques */
.portfolio-blueprint .block-header {
    height: 15%; /* Barre de nav */
    width: 100%;
}

.portfolio-blueprint .block-hero {
    height: 40%; /* Section Hero */
    width: 80%;
    align-self: center;
    position: relative;
}
/* Petit point simulant un bouton */
.portfolio-blueprint .block-hero::after {
    content: '';
    position: absolute;
    bottom: 10px; right: 10px;
    width: 20px; height: 20px;
    background-color: var(--accent-green, #84A98C);
    border-radius: 50%;
}

.portfolio-blueprint .block-content {
    height: 35%; /* Grille de projets */
    width: 100%;
    border-style: dashed !important; /* Lignes en pointillés */
}