/* ============================================================
   Escale Webinaires v2.0 — Front CSS
   Charte : bordeaux #6D071A · rose #E540A2 · doré #C9A961
   ============================================================ */

.escale-web-form-wrapper {
    max-width: 560px;
    margin: 30px auto;
    padding: 40px 35px;
    background: linear-gradient(180deg, #FFFFFF 0%, #FFF9FB 100%);
    border: 1px solid #F8C9E2;
    border-radius: 18px;
    box-shadow: 0 8px 35px rgba(109, 7, 26, 0.06);
    font-family: 'Open Sans', system-ui, sans-serif;
    color: #2A0D18;
}

.escale-web-form-header { text-align: center; margin-bottom: 28px; }
.escale-web-form-header h3 {
    font-family: 'DM Serif Display', Georgia, serif;
    color: #6D071A;
    font-size: 28px;
    margin: 0 0 10px;
    line-height: 1.3;
    font-weight: 400;
}
.escale-web-form-subtitle { color: #8E5572; font-size: 15px; margin: 0; line-height: 1.5; }

.escale-web-field { margin-bottom: 20px; }
.escale-web-field label {
    display: block;
    font-weight: 600;
    color: #6D071A;
    font-size: 14px;
    margin-bottom: 8px;
    letter-spacing: 0.3px;
}
.escale-web-field .required { color: #E540A2; }
.escale-web-field .optional { color: #8E5572; font-weight: 400; font-size: 12px; }

.escale-web-field input[type="text"],
.escale-web-field input[type="email"],
.escale-web-field input[type="tel"] {
    width: 100%;
    padding: 14px 16px;
    border: 1.5px solid #F0A0CF;
    border-radius: 10px;
    font-size: 15px;
    font-family: inherit;
    background: #FFFFFF;
    color: #2A0D18;
    box-sizing: border-box;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.escale-web-field input:focus {
    outline: none;
    border-color: #E540A2;
    box-shadow: 0 0 0 3px rgba(229, 64, 162, 0.15);
}

.escale-web-field small {
    display: block;
    font-size: 12px;
    color: #8E5572;
    margin-top: 6px;
    line-height: 1.4;
}

.escale-web-consent label {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-weight: 400;
    color: #2A0D18;
    font-size: 13px;
    line-height: 1.5;
    cursor: pointer;
}
.escale-web-consent input[type="checkbox"] {
    flex-shrink: 0;
    margin-top: 3px;
    width: 18px;
    height: 18px;
    accent-color: #E540A2;
    cursor: pointer;
}

.escale-web-submit-wrapper { text-align: center; margin-top: 28px; }
.escale-web-submit {
    background: linear-gradient(135deg, #6D071A 0%, #B5286C 50%, #E540A2 100%);
    color: #FFFFFF;
    border: none;
    padding: 16px 42px;
    border-radius: 50px;
    font-size: 15px;
    font-weight: 600;
    font-family: inherit;
    letter-spacing: 0.5px;
    cursor: pointer;
    transition: transform 0.15s, box-shadow 0.15s;
    box-shadow: 0 6px 18px rgba(229, 64, 162, 0.3);
}
.escale-web-submit:hover {
    transform: translateY(-2px);
    box-shadow: 0 9px 22px rgba(229, 64, 162, 0.4);
}
.escale-web-submit:disabled { opacity: 0.6; cursor: wait; transform: none; }

.escale-web-message { margin-top: 18px; padding: 0; text-align: center; font-size: 14px; }
.escale-web-message.escale-web-error {
    color: #B22D2D;
    background: #FFEBEB;
    border-radius: 10px;
    padding: 12px 16px;
}

.escale-web-success {
    text-align: center;
    padding: 30px 20px;
    animation: escaleFadeIn 0.4s ease;
}
.escale-web-success-icon { font-size: 54px; margin-bottom: 15px; }
.escale-web-success h3 {
    font-family: 'DM Serif Display', Georgia, serif;
    color: #6D071A;
    font-size: 26px;
    margin: 0 0 15px;
    font-weight: 400;
}
.escale-web-success p { color: #2A0D18; font-size: 15px; line-height: 1.6; margin: 0 0 10px; }
.escale-web-success-date {
    margin-top: 18px !important;
    padding: 14px 20px;
    background: #FDEAF5;
    border-radius: 10px;
    font-weight: 600;
    color: #6D071A;
}

.escale-web-closed, .escale-web-full {
    max-width: 520px;
    margin: 30px auto;
    text-align: center;
    padding: 40px 30px;
    background: #FAF3DE;
    border: 1px solid #C9A961;
    border-radius: 18px;
}
.escale-web-closed-icon, .escale-web-full-icon { font-size: 50px; margin-bottom: 15px; }
.escale-web-closed h3, .escale-web-full h3 {
    font-family: 'DM Serif Display', Georgia, serif;
    color: #6D071A;
    font-size: 24px;
    margin: 0 0 12px;
    font-weight: 400;
}
.escale-web-closed p, .escale-web-full p { color: #2A0D18; line-height: 1.6; margin: 0; }

.escale-web-countdown {
    max-width: 600px;
    margin: 30px auto;
    text-align: center;
    padding: 30px 20px;
    background: linear-gradient(135deg, #FDEAF5 0%, #F8C9E2 100%);
    border-radius: 18px;
}
.escale-web-countdown-label {
    font-family: 'DM Serif Display', Georgia, serif;
    color: #6D071A;
    font-size: 20px;
    margin: 0 0 20px;
}
.escale-web-countdown-blocks {
    display: flex;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
}
.escale-web-countdown-block {
    background: #FFFFFF;
    border-radius: 12px;
    padding: 15px 18px;
    min-width: 75px;
    box-shadow: 0 4px 14px rgba(109, 7, 26, 0.08);
}
.escale-web-countdown-block .cd-num {
    display: block;
    font-family: 'DM Serif Display', Georgia, serif;
    font-size: 32px;
    color: #6D071A;
    font-weight: 400;
    line-height: 1;
}
.escale-web-countdown-block .cd-lbl {
    display: block;
    font-size: 11px;
    color: #8E5572;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-top: 6px;
}

.escale-web-compteur {
    display: inline-block;
    background: #FDEAF5;
    color: #6D071A;
    padding: 8px 18px;
    border-radius: 50px;
    font-size: 14px;
    font-weight: 500;
}
.escale-web-compteur strong { color: #E540A2; font-size: 16px; }

@keyframes escaleFadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 600px) {
    .escale-web-form-wrapper {
        padding: 30px 22px;
        margin: 20px 12px;
        border-radius: 14px;
    }
    .escale-web-form-header h3 { font-size: 23px; }
    .escale-web-submit { padding: 14px 30px; font-size: 14px; width: 100%; }
    .escale-web-countdown-block { padding: 12px 14px; min-width: 65px; }
    .escale-web-countdown-block .cd-num { font-size: 26px; }
}