/* =======================================================================
   offre-grand-compte.css — page brouillon : offre cabinets 4000 lots+
   Hérite de styles.css / pages.css. Aucune couleur nouvelle.
   ======================================================================= */

/* bandeau condition */
.ogc-cond {
    display: inline-flex; align-items: center; gap: 12px; flex-wrap: wrap;
    background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.2);
    border-radius: 100px; padding: 9px 18px 9px 12px; margin-top: 26px;
    backdrop-filter: blur(6px);
}
.ogc-cond-pill {
    font-family: var(--font-mono); font-size: 11px; font-weight: 600;
    text-transform: uppercase; letter-spacing: 0.05em;
    background: #EFBF6E; color: #2B1259; padding: 5px 12px; border-radius: 100px;
}
.ogc-cond-text { font-size: 14px; color: rgba(255,255,255,0.92); }
.ogc-cond-text b { color: #fff; font-weight: 600; }

/* éligibilité : deux conditions */
.ogc-elig { display: grid; grid-template-columns: 1fr auto 1fr; gap: 20px; align-items: center; max-width: 880px; margin: 0 auto; }
.ogc-elig-card {
    background: #fff; border: 2px solid var(--violet-soft); border-radius: 16px;
    padding: 28px 26px; text-align: center;
}
.ogc-elig-k { font-family: var(--font-mono); font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--violet); margin-bottom: 10px; }
.ogc-elig-big { font-size: clamp(30px, 4vw, 44px); font-weight: 600; letter-spacing: -0.03em; color: var(--ink); line-height: 1; margin-bottom: 8px; }
.ogc-elig-big .u { font-size: 0.42em; font-weight: 500; color: var(--ink-4); }
.ogc-elig-d { font-size: 13.5px; color: var(--ink-3); line-height: 1.5; }
.ogc-elig-plus { font-size: 34px; font-weight: 300; color: var(--violet-lighter); }

/* avantages inclus */
.ogc-perks { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.ogc-perk {
    background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 30px 30px;
    position: relative; overflow: hidden; transition: all .25s;
}
.ogc-perk:hover { transform: translateY(-4px); border-color: var(--violet-lighter); box-shadow: 0 24px 54px -28px rgba(109,40,217,0.3); }
.ogc-perk.feature { grid-column: 1 / -1; background: linear-gradient(160deg, var(--violet-darker), var(--violet-darkest)); color: #fff; border-color: transparent; }
.ogc-perk-head { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.ogc-perk-icon {
    width: 50px; height: 50px; border-radius: 13px; flex-shrink: 0;
    background: var(--violet-soft); color: var(--violet); display: grid; place-items: center;
}
.ogc-perk.feature .ogc-perk-icon { background: rgba(255,255,255,0.14); color: #fff; }
.ogc-perk-gratuit {
    font-family: var(--font-mono); font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em;
    background: rgba(16,185,129,0.14); color: #0a7c5c; padding: 4px 10px; border-radius: 100px; margin-left: auto; align-self: flex-start;
}
.ogc-perk.feature .ogc-perk-gratuit { background: rgba(110,231,183,0.2); color: #6EE7B7; }
.ogc-perk-title { font-size: 19px; font-weight: 600; color: var(--ink); letter-spacing: -0.015em; }
.ogc-perk.feature .ogc-perk-title { color: #fff; }
.ogc-perk-desc { font-size: 14px; line-height: 1.6; color: var(--ink-3); }
.ogc-perk.feature .ogc-perk-desc { color: rgba(255,255,255,0.82); }
.ogc-perk-desc b { color: var(--ink); font-weight: 600; }
.ogc-perk.feature .ogc-perk-desc b { color: #fff; }

/* sur-mesure : déroulé en 4 temps */
.ogc-flow { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 22px; }
.ogc-flow-step { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.14); border-radius: 12px; padding: 18px 16px; }
.ogc-flow-n { font-family: var(--font-mono); font-size: 10.5px; color: var(--violet-lighter); letter-spacing: 0.06em; margin-bottom: 8px; }
.ogc-flow-t { font-size: 14.5px; font-weight: 600; color: #fff; margin-bottom: 5px; letter-spacing: -0.01em; }
.ogc-flow-d { font-size: 12.5px; line-height: 1.5; color: rgba(255,255,255,0.72); }

/* ce que ça remplace / vaut */
.ogc-value { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.ogc-value-card { background: var(--bg-soft); border: 1px solid var(--line); border-radius: 14px; padding: 26px 24px; text-align: center; }
.ogc-value-ico { width: 42px; height: 42px; border-radius: 11px; background: var(--violet-soft); color: var(--violet); display: grid; place-items: center; margin: 0 auto 14px; }
.ogc-value-t { font-size: 15.5px; font-weight: 600; color: var(--ink); margin-bottom: 7px; letter-spacing: -0.01em; }
.ogc-value-d { font-size: 13px; line-height: 1.55; color: var(--ink-3); }

@media (max-width: 860px) {
    .ogc-elig { grid-template-columns: 1fr; }
    .ogc-elig-plus { transform: rotate(90deg); }
    .ogc-perks { grid-template-columns: 1fr; }
    .ogc-flow { grid-template-columns: 1fr 1fr; }
    .ogc-value { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
    .ogc-flow { grid-template-columns: 1fr; }
}