body {
    background:#F2F2F2;
    width:100%;
    margin:0;
}

h2 {
    color:#e95f11;
    text-align:center;
    margin-bottom:50px;
}

a {
    color:black;
}

.brut {
    width:100%;
    text-align:center;
    margin:0;
    height:auto;
}

#section1 {
    display:block;
    width:80%;
    margin:0 auto;
}

#section2 {
    margin-top:30px;
    display:flex;
    gap:24px;
    justify-content:center;
    flex-wrap:wrap;
    padding:0 20px 40px 20px;
}

#banner {
    background-size:1600px;
    height:266px;
    width:100%;
    overflow:hidden;
    margin-bottom:20px;
    background-repeat:no-repeat;
    background-position:center top;
}

.titre_cagnotte {
    position:relative;
    top:0;
    width:100%;
    font-size:1.7em;
    font-weight:400;
    color:#e96316;
    background:white;
    border:1px dotted #E9954A;
    margin:0 auto;
    border-radius:5px;
    text-transform:uppercase;
    z-index:200;
    word-wrap:break-word;
    text-align:center;
    padding:10px 0;
    box-sizing:border-box;
}

/* DESCRIPTION */

#bloc1 {
    background:white;
    height:auto;
    min-height:200px;
    padding:15px 30px;
    color:#242424;
    margin-bottom:10px;
    font-size:0.85em;
    text-align:justify;
    white-space:normal;
    line-height:normal;
    border-radius:3px;
    box-sizing:border-box;
}

#sous_bloc {
    width:100%;
    box-sizing:border-box;
}

#pitch {
    overflow:visible;
    max-width:100%;
    line-height:1.55;
}

#pitch p {
    margin-top:0;
    margin-bottom:1em;
}

#pitch img {
    display:block;
    margin:15px auto;
    height:auto;
    max-width:100%;
}

/* Si TinyMCE enregistre style="width:700px", cette taille est respectée.
   max-width:100% évite seulement le débordement du bloc. */

#pitch iframe {
    max-width:100%;
}

#bloc1 a {
    color:#030b6b;
    text-decoration:none;
}

#bloc1 p {
    margin-bottom:0;
}

#signal {
    margin-top:20px;
    text-align:right;
    color:dimgrey;
    font-size:11px;
    display:block;
}

/* MONTANT */

.bloc_montant {
    background:white;
    width:80%;
    padding:32px 28px;
    margin:0 auto 30px auto;
    display:block;
    border-radius:16px;
    box-shadow:0 4px 20px rgba(0,0,0,0.06);
    text-align:center;
    box-sizing:border-box;
}

.montant-total {
    font-size:40px;
    font-weight:800;
    color:#e96316;
    line-height:1.1;
    margin-bottom:4px;
}

.countdown-wrap {
    display:flex;
    justify-content:center;
    gap:14px;
    margin:0 0 28px 0;
    flex-wrap:wrap;
}

.countdown-item {
    background:#fafafa;
    border:1px solid #f0f0f0;
    border-radius:12px;
    padding:10px 16px;
    min-width:64px;
    text-align:center;
}

.countdown-value {
    font-size:22px;
    font-weight:800;
    color:#e96316;
    line-height:1.1;
    font-variant-numeric:tabular-nums;
}

.countdown-label {
    font-size:10px;
    color:#aaa;
    text-transform:uppercase;
    letter-spacing:1.5px;
    margin-top:4px;
}


.montant-label {
    display:block;
    font-size:13px;
    font-weight:500;
    color:#aaa;
    text-transform:uppercase;
    letter-spacing:2.5px;
    margin-bottom:24px;
    margin-top:4px;
}

.montant-stats {
    display:flex;
    justify-content:center;
    align-items:center;
    background:#fafafa;
    border-radius:12px;
    padding:18px 0;
    margin-bottom:28px;
    border:1px solid #f0f0f0;
}

.stat-item {
    flex:1;
    text-align:center;
}

.stat-value {
    font-size:24px;
    font-weight:800;
    color:#2a2a2a;
    line-height:1.2;
}

.stat-label {
    font-size:12px;
    color:#aaa;
    text-transform:uppercase;
    letter-spacing:1.5px;
    margin-top:4px;
}

.stat-divider {
    width:1px;
    height:36px;
    background:#e8e8e8;
    flex-shrink:0;
}

#btn_join {
    width:35%;
    background:#cf8243;
    color:white;
    border:none;
    border-radius:12px;
    font-size:15px;
    font-weight:700;
    cursor:pointer;
    transition:transform 0.2s, box-shadow 0.2s;
    margin-bottom:0;
    padding:13px;
    box-sizing:border-box;
}

#btn_join:hover {
    transform:translateY(-2px);
    box-shadow:0 8px 24px rgba(233,99,22,0.3);
}

/* ÉQUIPES */

.bloc7 {
    background:white;
    width:60%;
    padding:28px 24px;
    border-radius:16px;
    box-shadow:0 4px 20px rgba(0,0,0,0.06);
    box-sizing:border-box;
}

.bloc7 h2 {
    font-size:0.75em;
    text-transform:uppercase;
    letter-spacing:3px;
    color:#999;
    text-align:left;
    border-bottom:1px solid #f0f0f0;
    padding-bottom:16px;
    margin-bottom:20px;
}

.grid-cards {
    display:flex;
    flex-direction:column;
    gap:0;
}

.team-block {
    display:flex;
    flex-direction:column;
    margin-bottom:8px;
}

.card-item {
    display:flex;
    align-items:center;
    gap:14px;
    padding:14px;
    border-radius:12px;
    background:#fafafa;
    border:1px solid #f0f0f0;
    transition:box-shadow 0.2s, transform 0.2s;
    text-decoration:none;
    color:inherit;
    margin-bottom:8px;
    box-sizing:border-box;
}

.card-item:hover {
    box-shadow:0 4px 16px rgba(233,99,22,0.12);
    transform:translateY(-2px);
    border-color:#f5d5be;
}

.team-header {
    cursor:pointer;
    user-select:none;
    margin-bottom:0;
    border-radius:12px;
}

.team-header[aria-expanded="true"] {
    border-radius:12px 12px 0 0;
    border-bottom-color:transparent;
}

.badge-rang {
    width:28px;
    height:28px;
    border-radius:8px;
    background:#f2f2f2;
    color:#bbb;
    font-size:11px;
    font-weight:800;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
}

.badge-rang.gold { background:#fff4e0; color:#e96316; }
.badge-rang.silver { background:#f5f5f5; color:#888; }
.badge-rang.bronze { background:#fdf0ea; color:#b87333; }

.card-avatar {
    width:44px;
    height:44px;
    border-radius:50%;
    background-size:cover;
    background-position:center;
    border:2px solid #ffe8d6;
    flex-shrink:0;
}

.card-info {
    flex:1;
    overflow:hidden;
}

.card-name {
    font-size:13px;
    font-weight:700;
    color:#2a2a2a;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    margin-bottom:6px;
}

.badge-equipe {
    background:#e8f4ff;
    color:#3a8fd4;
    font-size:0.72em;
    padding:2px 8px;
    border-radius:10px;
    font-weight:600;
    margin-right:4px;
}

.progress-bar {
    height:5px;
    background:#f0f0f0;
    border-radius:99px;
    overflow:hidden;
}

.progress-fill {
    height:100%;
    background:linear-gradient(90deg, #e96316, #f5a96a);
    border-radius:99px;
    transition:width 0.6s ease;
}

.card-amount {
    font-size:13px;
    font-weight:800;
    color:#e96316;
    background:#fff4ee;
    padding:4px 10px;
    border-radius:20px;
    white-space:nowrap;
    flex-shrink:0;
}

.team-toggle-icon {
    display:flex;
    align-items:center;
    gap:5px;
    margin-left:6px;
    color:#aaa;
    flex-shrink:0;
}

.collectors-count {
    font-size:11px;
    font-weight:700;
    background:#f0f0f0;
    color:#888;
    border-radius:20px;
    padding:2px 7px;
    line-height:1.4;
}

.chevron {
    transition:transform 0.25s ease;
    display:block;
}

.team-header[aria-expanded="true"] .chevron {
    transform:rotate(180deg);
}

.collectors-list {
    background:#f7f7f7;
    border:1px solid #f0f0f0;
    border-top:none;
    border-radius:0 0 12px 12px;
    overflow:hidden;
    margin-bottom:8px;
}

.collector-item {
    background:transparent;
    border:none;
    border-top:1px solid #efefef;
    border-radius:0;
    margin-bottom:0;
    padding:10px 14px 10px 10px;
    animation:slideDown 0.18s ease;
}

.collector-item:first-child {
    border-top:none;
}

.collector-item:last-child {
    border-radius:0 0 12px 12px;
}

.collector-item:hover {
    background:rgba(233,99,22,0.04);
    transform:none;
    box-shadow:none;
    border-color:#efefef;
}

.collector-indent {
    width:20px;
    flex-shrink:0;
    position:relative;
    align-self:stretch;
}

.collector-indent::before {
    content:'';
    position:absolute;
    left:10px;
    top:50%;
    width:10px;
    height:1px;
    background:#d8d8d8;
}

.collector-indent::after {
    content:'';
    position:absolute;
    left:10px;
    top:0;
    bottom:50%;
    width:1px;
    background:#d8d8d8;
}

.card-avatar-small {
    width:34px !important;
    height:34px !important;
}

.badge-small {
    width:22px !important;
    height:22px !important;
    font-size:10px !important;
    border-radius:6px !important;
}

.progress-bar-slim {
    height:3px !important;
}

@keyframes slideDown {
    from { opacity:0; transform:translateY(-4px); }
    to { opacity:1; transform:translateY(0); }
}

/* DIVERS */

.orga {
    font-size:1.1em;
    margin-bottom:30px;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}

form {
    width:80%;
    margin:0 auto;
}

button {
    font-size:16px;
    width:70%;
    margin:0 0 20px 0;
}

.mes_cagnottes {
    margin-top:40px;
}

.countdown-date {
    font-size:12px;
    color:#aaa;
    margin:-18px 0 24px 0;
    text-align:center;
}

/* MOBILE TRÈS PETIT */

@media screen and (max-width:479px) {
    #banner {
        margin-bottom:20px;
        height:75px;
        background-size:479px;
    }

    .bloc_msg {
        width:4%;
    }
}

/* MOBILE */

@media screen and (min-width:0px) and (max-width:768px) {
    .brut {
        width:100%;
    }

    #banner {
        margin-bottom:20px;
        height:125px;
        background-size:768px;
    }

    #section1 {
        width:100%;
    }

    #section2 {
        flex-direction:column;
        padding:0 10px 30px;
    }

    #bloc1,
    .bloc_montant {
        margin:0 auto 10px auto;
        padding:20px 5%;
        width:90%;
        box-sizing:border-box;
    }

    #pitch img {
        max-width:100%;
        height:auto;
    }

    #pitch iframe {
        width:100%;
    }

    .titre_cagnotte {
        font-size:1.3em;
        width:98%;
        top:-10px;
    }

    .bloc7 {
        width:100%;
        margin:0 auto;
        padding:28px 10px;
    }

    .montant-total {
        font-size:36px;
    }

    .stat-value {
        font-size:18px;
    }

    #btn_join {
        font-size:14px;
        padding:13px;
        width:80%;
    }

    .card-amount {
        font-size:12px;
        padding:3px 8px;
    }

    .collector-item {
        padding:8px 10px 8px 8px;
    }

    .card-avatar-small {
        width:30px !important;
        height:30px !important;
    }

    .collector-indent {
        width:14px;
    }

    .collectors-count {
        font-size:10px;
        padding:1px 5px;
    }

    .team-header .badge-rang,
    .team-header .team-toggle-icon {
        display:none;
    }

    .collector-item .badge-rang {
        display:none;
    }

    .team-header .card-name {
        display:flex;
        flex-direction:column;
        align-items:flex-start;
        gap:3px;
        white-space:normal;
    }

    .team-header .badge-equipe {
        display:inline-block;
        margin-right:0;
        margin-bottom:1px;
    }

    .countdown-item {
        min-width:54px;
        padding:8px 10px;
    }
    .countdown-value {
        font-size:18px;
    }
}

/* TABLETTE */

@media screen and (min-width:769px) and (max-width:979px) {
    #banner {
        height:163px;
        background-size:979px;
    }

    #section1 {
        width:85%;
    }

    .bloc7 {
        width:80%;
    }

    .titre_cagnotte {
        font-size:1em;
    }

    #bloc1 {
        font-size:0.85em;
    }

    .montant-total {
        font-size:38px;
    }
}

/* MOYEN FORMAT */

@media screen and (min-width:980px) and (max-width:1280px) {
    #banner {
        height:170px;
        background-size:1024px;
    }

    #section1 {
        width:80%;
    }

    .bloc7 {
        width:55%;
    }

    .titre_cagnotte {
        font-size:1.1em;
    }

    #bloc1 {
        font-size:0.85em;
    }

    .montant-total {
        font-size:42px;
    }
}

/* GRAND FORMAT */

@media screen and (min-width:1601px) {
    #banner {
        height:320px;
        background-size:1920px;
    }

    #section1 {
        width:70%;
    }

    .bloc7 {
        width:40%;
    }

    .titre_cagnotte {
        font-size:1.5em;
    }

    #bloc1 {
        font-size:0.95em;
    }

    .montant-total {
        font-size:56px;
    }

    .stat-value {
        font-size:28px;
    }
}