body { margin: 0; background: #f4f4f2; font-family: 'Roboto', Arial, sans-serif; }
  .demo-content { max-width: 900px; margin: 50px auto; padding: 0 20px; color: #2b2b2b; }

/* Portail résident */

.intro-residence{
    text-align:center;
    max-width:900px;
    margin:30px auto;
    font-size:1.15rem;
}


.portail-cartes{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    gap:25px;
    margin:40px auto;
    max-width:1100px;
}


.portail-carte{
    display:block;
    padding:25px;
    background:#ffffff;
    border-radius:16px;
    text-decoration:none;
    color:#333;
    box-shadow:0 3px 12px rgba(0,0,0,0.12);
    transition:transform .2s, box-shadow .2s;
}


.portail-carte:hover{
    transform:translateY(-5px);
    box-shadow:0 6px 18px rgba(0,0,0,0.18);
}


.portail-carte .icone{
    font-size:42px;
    display:block;
    margin-bottom:15px;
}


.portail-carte h2{
    color:#1f4d3d;
    font-size:1.5rem;
    margin-bottom:10px;
}


.portail-carte p{
    font-size:1.05rem;
    line-height:1.5;
}
.notice-activites{
    max-width:900px;
    margin:30px auto;
    font-size:1.05rem;
    line-height:1.6;
}

.notice-activites h2{
    color:#1f4d3d;
    margin-top:35px;
}

.notice-activites h3{
    color:#2c6b55;
    margin-top:25px;
}

.notice-activites ol li,
.notice-activites ul li{
    margin-bottom:8px;
}

.info-box,
.contact-box{
    background:#f4f1ea;
    padding:20px;
    border-radius:12px;
    margin:25px 0;
    border-left:5px solid #1f4d3d;
}
.infos-pratiques{
    max-width:900px;
    margin:30px auto;
    line-height:1.6;
}

.infos-pratiques h2{
    color:#1f4d3d;
    text-align:center;
    margin-bottom:25px;
}

.info-box{
    background:#f4f1ea;
    padding:18px;
    margin:15px 0;
    border-radius:12px;
    border-left:5px solid #1f4d3d;
}

.info-box h3{
    margin-top:0;
    color:#2c6b55;
}

.info-box ul{
    margin-bottom:0;
}

.info-contact{
    margin-top:25px;
    padding:15px;
    text-align:center;
    background:#eef5f1;
    border-radius:12px;
}