/*
 * Micro-site pour borne accueil Réf-Médias
 * janvier 2026
 * Réf-Médias / Yves Bresson
 */

:root {
    --gap: 45px;
}

* {
    box-sizing: border-box;
}

body {
   font-weight: normal; /* regular, 400 */
   font-size: 23px;

   color: black;
   background-color: #ff004a;
}

.wrapper {
    width: 100%;
    height: 100vh;
}

.container {
    display: grid;
    width: 100%;
    height: 100%;
    
    grid-template-columns: 1fr 1fr;
    /*grid-template-rows: auto;*/
    
    padding: var(--gap);
    column-gap: var(--gap);
    row-gap: var(--gap);
    
    /* alignement des trucs dans les cases de la grille */
    justify-items: center; /* stretch */ /* horizontal/ligne */
    align-items: center; /* stretch */ /* vertical/colonne */
    /* = place-items: center; */
    
    /* alignement de la grille dans son container */
    justify-content: stretch;
    align-content: stretch;
    /* = place-content: stretch; */
    
    /*grid-auto-flow: row;*/
}

.item {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative; /* for logo */
}

.item img.site {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;

    /*filter: grayscale(70%) blur(10px);*/
    filter: contrast(20%) blur(4px);
}

.item .logo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    display: flex;
    justify-content: center;    /* horizontal */
    align-items: center;    /* vertical */
}

.item .logo img {
    max-width: 400px;
    max-height: 200px;
}