/* ==========================================================================
   COM'X — Page SEO & acquisition (Optimix)
   Complète audit-3d.css et solution-creatix.css : étoile verte, illustrations des cartes.
   ========================================================================== */

body.aud-3d--green .aud-fly-star{background:linear-gradient(150deg,#b4ee86,#3f8a1c)}
body.aud-3d--green .crea-tag{color:#2c6414;background:#ecf8e2;border-color:#2c6414}

.crea-visual--green{--bg:linear-gradient(135deg,#6fbf3f,#1b4a10)}
.crea-visual--ink{--bg:linear-gradient(135deg,#2a2a44,#0a0a12)}

/* feuille commune aux quatre illustrations */
.opt-sheet{
  position:absolute;z-index:1;left:14%;right:14%;top:11%;bottom:11%;
  display:flex;flex-direction:column;gap:.5rem;padding:5% 6%;
  background:#fff;border:3px solid #0a0a12;border-radius:8px;
  box-shadow:0 18px 30px rgba(0,0,0,.35);
  transform:rotate(-2deg);transition:transform .5s var(--ease);
}
.crea-card:hover .opt-sheet{transform:rotate(0deg) translateY(-6px)}
.opt-title{margin:0;font-family:var(--font-stamp);font-size:clamp(1rem,2.4vw,1.25rem);letter-spacing:.03em;color:#0a0a12}

/* 1. contrôle technique */
.opt-checks ul{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}
.opt-checks li{display:grid;grid-template-columns:auto 1fr;gap:.1rem .5rem;align-items:center;font-size:clamp(.65rem,1.6vw,.8rem);font-weight:700;color:#0a0a12}
.opt-checks li i{grid-row:1/3;display:grid;place-items:center;width:1.3em;height:1.3em;border-radius:50%;background:#6fbf3f;color:#fff;border:2px solid #0a0a12;font-style:normal;font-size:.85em}
.opt-checks li b{display:block;height:6px;border-radius:99px;background:#e6e3ef;position:relative}
.opt-checks li b::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--w);border-radius:99px;background:#6fbf3f}

/* 2. résultats de recherche */
.opt-serp{gap:.55rem}
.opt-search{margin:0;display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.35rem .7rem;border:2px solid #0a0a12;border-radius:99px;background:#f6f2e9}
.opt-search span{font-size:clamp(.62rem,1.6vw,.8rem);font-weight:700;color:#0a0a12;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.opt-search i{flex:none;width:.8em;height:.8em;border:2px solid #0a0a12;border-radius:50%;position:relative}
.opt-result{display:grid;gap:4px;padding:.3rem .2rem}
.opt-result b,.opt-result u,.opt-result s{display:block;height:6px;border-radius:99px;background:#d9d6e6;text-decoration:none}
.opt-result b{width:46%;height:8px;background:#2a5fe0}
.opt-result u{width:90%}
.opt-result s{width:70%}
.opt-result--top{background:#fff6d6;border:2px solid #0a0a12;border-radius:8px;padding:.4rem .5rem;position:relative}
.opt-result--top::after{content:"1";position:absolute;right:.4rem;top:.3rem;display:grid;place-items:center;width:1.5em;height:1.5em;border-radius:50%;background:#ffcf3f;border:2px solid #0a0a12;font-family:var(--font-stamp);font-size:.8rem;color:#0a0a12}

/* 3. graphique de visites */
.opt-bars{flex:1;display:flex;align-items:flex-end;gap:6px;border-bottom:3px solid #0a0a12;padding-top:.3rem}
.opt-bars i{flex:1;height:var(--h);background:linear-gradient(#8a5cf0,#6c3ce0);border:2px solid #0a0a12;border-bottom:0;border-radius:5px 5px 0 0}
.opt-bars i:last-child{background:linear-gradient(#ffcf3f,#f5a623)}

/* 4. fiche d'établissement */
.opt-local{gap:.45rem}
.opt-map{position:relative;flex:1;min-height:0;border:2px solid #0a0a12;border-radius:6px;overflow:hidden;
  background:
    linear-gradient(90deg,transparent 46%,#fff 46% 54%,transparent 54%),
    linear-gradient(0deg,transparent 40%,#fff 40% 48%,transparent 48%),
    linear-gradient(20deg,transparent 60%,#f9d98a 60% 66%,transparent 66%),
    #dfe9d3}
.opt-pin{position:absolute;left:50%;top:48%;width:1.6rem;height:1.6rem;translate:-50% -100%;background:#e63946;border:3px solid #0a0a12;border-radius:50% 50% 50% 0;rotate:-45deg}
.opt-pin::after{content:"";position:absolute;inset:25%;border-radius:50%;background:#fff}
.opt-name{margin:0;width:62%;height:9px;border-radius:99px;background:#0a0a12}
.opt-stars{margin:0;font-size:clamp(.85rem,2.2vw,1.1rem);letter-spacing:.12em;color:#f5a623;line-height:1}

@media (prefers-reduced-motion:reduce){.opt-sheet{transition:none}}
