/* ========================================
   COMPARATEUR - Styles spécifiques
   ======================================== */

/* ========== TOOL HERO ========== */
.tool-hero{background:linear-gradient(160deg,#04092e 0%,#091656 40%,#0d1f7a 100%);padding:120px 0 64px;text-align:center;position:relative;overflow:hidden}
.tool-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 30% 50%,rgba(221,192,126,.06) 0%,transparent 50%)}
.tool-hero-content{position:relative;z-index:1;max-width:700px;margin:0 auto}
.tool-hero-title{font-size:clamp(1.8rem,4vw,2.8rem);color:#fff;margin-bottom:16px;line-height:1.1}
.tool-hero-title em{background:linear-gradient(135deg,var(--color-gold),var(--color-gold-light));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.tool-hero-subtitle{font-size:clamp(.88rem,1.2vw,1rem);color:rgba(255,255,255,.6);line-height:1.8;font-weight:300}

/* ========== TOOL LAYOUT ========== */
.tool-section{padding:40px 0 var(--section-padding)}
.tool-layout{display:grid;grid-template-columns:280px 1fr;gap:32px;align-items:start}

/* ========== SIDEBAR ========== */
.tool-sidebar{position:sticky;top:80px;background:var(--color-white);border-radius:var(--radius-lg);border:1px solid var(--color-border);padding:24px;box-shadow:var(--shadow-sm)}
.sidebar-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid var(--color-border)}
.sidebar-header h2{font-family:var(--font-body);font-size:1rem;font-weight:600;color:var(--color-primary)}
.sidebar-reset{background:none;border:none;font-family:var(--font-body);font-size:.72rem;color:var(--color-gold-dark);cursor:pointer;font-weight:500;transition:color .2s}
.sidebar-reset:hover{color:var(--color-primary)}

.filter-form{display:flex;flex-direction:column;gap:20px}
.filter-group>label{display:block;font-size:.72rem;font-weight:600;color:var(--color-text);letter-spacing:.02em;margin-bottom:8px}
.filter-group select{width:100%;padding:10px 14px;border:1.5px solid var(--color-border);border-radius:var(--radius-md);font-family:var(--font-body);font-size:.82rem;color:var(--color-text);background:var(--color-bg);outline:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239CA3AF' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:32px;transition:border-color .2s}
.filter-group select:focus{border-color:var(--color-gold)}

.filter-checks{display:flex;flex-direction:column;gap:10px}
.filter-check{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:.82rem;color:var(--color-text);font-weight:400;transition:color .2s}
.filter-check:hover{color:var(--color-primary)}
.filter-check input{position:absolute;opacity:0;width:0;height:0}
.filter-check-box{width:18px;height:18px;border:1.5px solid var(--color-border);border-radius:4px;flex-shrink:0;transition:all .2s;position:relative;background:var(--color-bg)}
.filter-check input:checked+.filter-check-box{background:var(--color-gold);border-color:var(--color-gold)}
.filter-check input:checked+.filter-check-box::after{content:'';position:absolute;top:2px;left:5px;width:5px;height:8px;border:solid var(--color-primary);border-width:0 2px 2px 0;transform:rotate(45deg)}

.sidebar-cta{margin-top:24px;padding-top:20px;border-top:1px solid var(--color-border)}
.sidebar-cta p{font-size:.78rem;color:var(--color-text-muted);margin-bottom:12px;line-height:1.5}

/* Mobile filter toggle */
.filter-toggle{display:none;align-items:center;justify-content:center;gap:8px;width:100%;padding:12px;background:var(--color-white);border:1px solid var(--color-border);border-radius:var(--radius-md);font-family:var(--font-body);font-size:.84rem;font-weight:600;color:var(--color-primary);cursor:pointer;margin-bottom:16px;transition:all .2s}
.filter-toggle:hover{border-color:var(--color-gold);box-shadow:var(--shadow-sm)}
.filter-count{background:var(--color-gold);color:var(--color-primary);font-size:.65rem;font-weight:700;width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center}

/* ========== RESULTS ========== */
.results-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;gap:16px}
.results-info{display:flex;align-items:baseline;gap:8px}
#results-count{font-family:var(--font-body);font-size:.92rem;font-weight:600;color:var(--color-primary)}
.results-hint{font-size:.72rem;color:var(--color-text-muted)}
.sort-select{padding:8px 32px 8px 12px;border:1.5px solid var(--color-border);border-radius:var(--radius-md);font-family:var(--font-body);font-size:.78rem;color:var(--color-text);background:var(--color-white);outline:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239CA3AF' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;cursor:pointer}

/* ========== CONTRACT CARDS ========== */
.contracts-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}

.contract-card{background:var(--color-white);border-radius:var(--radius-lg);border:1px solid var(--color-border);overflow:hidden;transition:all .4s var(--ease-out);position:relative;display:flex;flex-direction:column}
.contract-card:hover{border-color:rgba(221,192,126,.3);box-shadow:var(--shadow-lg);transform:translateY(-4px)}
.contract-card.top-match{border-color:var(--color-gold);box-shadow:0 4px 24px rgba(221,192,126,.15)}

/* Top match badge */
.card-badge{position:absolute;top:16px;right:16px;font-size:.6rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:4px 12px;border-radius:var(--radius-full);z-index:1}
.card-badge--top{background:linear-gradient(135deg,var(--color-gold),var(--color-gold-dark));color:var(--color-primary)}
.card-badge--match{background:rgba(9,22,86,.06);color:var(--color-primary)}

/* Card header */
.card-header{padding:24px 24px 16px;border-bottom:1px solid var(--color-border)}
.card-company{font-size:.68rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-muted);margin-bottom:4px}
.card-name{font-family:var(--font-display);font-size:1.15rem;font-weight:600;color:var(--color-primary);line-height:1.25;margin-bottom:12px}

/* Solvency bar */
.solvency-row{display:flex;align-items:center;gap:10px}
.solvency-label{font-size:.68rem;color:var(--color-text-muted);white-space:nowrap}
.solvency-bar{flex:1;height:6px;background:var(--color-border);border-radius:3px;overflow:hidden;position:relative}
.solvency-fill{height:100%;border-radius:3px;transition:width .8s var(--ease-out)}
.solvency-fill--high{background:linear-gradient(90deg,var(--color-gold),#b8a455)}
.solvency-fill--mid{background:linear-gradient(90deg,#e8b84a,#d4a03a)}
.solvency-fill--low{background:linear-gradient(90deg,#e88a4a,#d47a3a)}
.solvency-value{font-family:var(--font-display);font-size:.82rem;font-weight:600;color:var(--color-primary);min-width:40px;text-align:right}

/* Card body - metrics */
.card-body{padding:16px 24px;flex:1}
.card-metrics{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px;margin-bottom:16px}
.card-metric{display:flex;flex-direction:column;gap:2px}
.card-metric-label{font-size:.62rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--color-text-muted)}
.card-metric-value{font-size:.84rem;font-weight:600;color:var(--color-primary)}

/* Tags */
.card-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.card-tag{font-size:.62rem;font-weight:600;padding:3px 10px;border-radius:var(--radius-full);letter-spacing:.02em}
.card-tag--yes{background:rgba(221,192,126,.1);color:var(--color-gold-dark)}
.card-tag--no{background:rgba(156,163,175,.08);color:var(--color-text-muted);text-decoration:line-through;opacity:.5}

/* Opinion toggle */
.card-opinion-toggle{display:flex;align-items:center;gap:6px;background:none;border:none;font-family:var(--font-body);font-size:.72rem;font-weight:500;color:var(--color-gold-dark);cursor:pointer;padding:0;margin-bottom:8px;transition:color .2s}
.card-opinion-toggle:hover{color:var(--color-primary)}
.card-opinion-toggle svg{transition:transform .3s}
.card-opinion-toggle.open svg{transform:rotate(180deg)}
.card-opinion{max-height:0;overflow:hidden;transition:max-height .4s var(--ease-out)}
.card-opinion.open{max-height:200px}
.card-opinion p{font-size:.78rem;color:var(--color-text-light);line-height:1.7;padding-bottom:8px}

/* Card footer / CTA */
.card-footer{padding:0 24px 20px;margin-top:auto}
.card-cta{width:100%;padding:12px;border-radius:var(--radius-full);background:var(--color-primary);color:var(--color-white);font-family:var(--font-body);font-size:.82rem;font-weight:600;border:none;cursor:pointer;transition:all .3s var(--ease-out);display:flex;align-items:center;justify-content:center;gap:8px}
.card-cta:hover{background:var(--color-primary-light);transform:translateY(-1px);box-shadow:0 4px 16px rgba(9,22,86,.2)}
.top-match .card-cta{background:linear-gradient(135deg,var(--color-gold),var(--color-gold-dark));color:var(--color-primary)}
.top-match .card-cta:hover{filter:brightness(1.05);box-shadow:0 4px 16px rgba(221,192,126,.3)}

/* ========== NO RESULTS ========== */
.no-results{text-align:center;padding:64px 24px;background:var(--color-white);border-radius:var(--radius-lg);border:1px solid var(--color-border)}
.no-results-icon{font-family:var(--font-display);font-size:3rem;font-weight:600;color:var(--color-text-muted);opacity:.3;margin-bottom:16px}
.no-results h3{font-family:var(--font-body);font-size:1.1rem;font-weight:600;color:var(--color-primary);margin-bottom:8px}
.no-results p{font-size:.86rem;color:var(--color-text-light)}
.no-results a{color:var(--color-gold-dark);font-weight:500;text-decoration:underline}

/* ========== TOOL CTA ========== */
.tool-cta-section{padding:0 0 var(--section-padding);background:var(--color-bg)}
.tool-cta-card{background:var(--color-primary);border-radius:var(--radius-xl);padding:56px 48px;text-align:center;position:relative;overflow:hidden}
.tool-cta-card::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 0%,rgba(221,192,126,.08) 0%,transparent 50%)}
.tool-cta-card h2{font-size:clamp(1.4rem,2.8vw,1.8rem);color:#fff;margin-bottom:12px;position:relative}
.tool-cta-card h2 em{color:var(--color-gold)}
.tool-cta-card p{font-size:.92rem;color:rgba(255,255,255,.55);line-height:1.8;margin-bottom:28px;max-width:500px;margin-left:auto;margin-right:auto;position:relative}
.tool-cta-card .btn{position:relative}

/* ========== MODAL ========== */
.modal-overlay{position:fixed;inset:0;z-index:2000;background:rgba(4,9,46,.6);backdrop-filter:blur(8px);display:none;align-items:center;justify-content:center;padding:24px;opacity:0;transition:opacity .3s}
.modal-overlay[hidden]{display:none!important}
.modal-overlay:not([hidden]){display:flex}
.modal-overlay.visible{opacity:1}
.modal-card{background:var(--color-white);border-radius:var(--radius-xl);padding:36px 32px;max-width:480px;width:100%;position:relative;box-shadow:var(--shadow-xl);transform:translateY(20px) scale(.97);transition:transform .35s var(--ease-out);max-height:90vh;overflow-y:auto}
.modal-overlay.visible .modal-card{transform:translateY(0) scale(1)}
.modal-close{position:absolute;top:16px;right:16px;width:36px;height:36px;border-radius:50%;background:var(--color-bg);border:1px solid var(--color-border);font-size:1.3rem;color:var(--color-text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;line-height:1}
.modal-close:hover{background:var(--color-border);color:var(--color-text)}
.modal-header{text-align:center;margin-bottom:24px}
.modal-badge{display:inline-block;font-size:.62rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-gold-dark);background:rgba(221,192,126,.1);border:1px solid rgba(221,192,126,.2);border-radius:var(--radius-full);padding:4px 14px;margin-bottom:12px}
.modal-header h2{font-family:var(--font-display);font-size:1.4rem;color:var(--color-primary);margin-bottom:6px}
.modal-header p{font-size:.84rem;color:var(--color-text-muted)}
.modal-header strong{color:var(--color-primary)}
.modal-form{display:flex;flex-direction:column;gap:14px}
.modal-form .form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.modal-success{text-align:center;padding:24px 0}
.modal-success svg{margin-bottom:16px}
.modal-success h3{font-family:var(--font-body);font-size:1.1rem;font-weight:600;color:var(--color-primary);margin-bottom:8px}
.modal-success p{font-size:.84rem;color:var(--color-text-light);line-height:1.7}

/* ========== RESPONSIVE ========== */
@media(max-width:1024px){
    .tool-layout{grid-template-columns:260px 1fr;gap:24px}
    .contracts-grid{grid-template-columns:1fr}
}
@media(max-width:768px){
    .tool-hero{padding:100px 0 48px}
    .tool-section{padding:24px 0 var(--section-padding)}
    .tool-layout{grid-template-columns:1fr}

    /* Sidebar becomes collapsible */
    .tool-sidebar{position:static;display:none;margin-bottom:8px}
    .tool-sidebar.open{display:block}
    .filter-toggle{display:flex}

    .contracts-grid{grid-template-columns:1fr}
    .card-header{padding:20px 20px 14px}
    .card-body{padding:14px 20px}
    .card-footer{padding:0 20px 16px}
    .card-name{font-size:1.05rem}
    .card-metrics{gap:10px 12px}
    .card-metric-value{font-size:.8rem}

    .results-header{flex-direction:column;align-items:flex-start;gap:8px}
    .sort-select{width:100%}

    .tool-cta-card{padding:40px 24px}
    .modal-card{padding:28px 24px;margin:16px}
    .modal-form .form-row{grid-template-columns:1fr}
}
@media(max-width:400px){
    .tool-hero-title{font-size:1.5rem}
    .card-metrics{grid-template-columns:1fr}
    .card-header{padding:16px 16px 12px}
    .card-body{padding:12px 16px}
    .card-footer{padding:0 16px 14px}
}
