/* ORTENEO — finitions premium du Diagnostic de peau (visuel uniquement : aucune logique modifiée). */
.page-template-page-diagnostic .diag-intro{ border-radius:22px; box-shadow:0 24px 50px -30px rgba(0,30,69,.6); }
.page-template-page-diagnostic .diag-trust-row span{ display:inline-flex; align-items:center; gap:7px; }
.page-template-page-diagnostic .diag-trust-row svg{ width:16px; height:16px; color:#D5B274; flex:0 0 16px; }

/* Cartes d'options : coins arrondis, survol doux, sélection avec coche */
.page-template-page-diagnostic .diag-opt-card,
.page-template-page-diagnostic .diag-opt-wide,
.page-template-page-diagnostic .diag-concern-card{
  border-radius:16px; position:relative; overflow:hidden;
  transition:border-color .2s, box-shadow .2s, transform .2s, background .2s;
}
.page-template-page-diagnostic .diag-opt-card:hover,
.page-template-page-diagnostic .diag-opt-wide:hover,
.page-template-page-diagnostic .diag-concern-card:hover{ box-shadow:0 10px 24px -18px rgba(0,30,69,.55); transform:translateY(-1px); }
.page-template-page-diagnostic .diag-opt-card.selected,
.page-template-page-diagnostic .diag-opt-wide.selected,
.page-template-page-diagnostic .diag-concern-card.selected{ border-color:#BF964B; box-shadow:0 0 0 1.5px #BF964B, 0 12px 26px -18px rgba(191,150,75,.7); }
.page-template-page-diagnostic .diag-opt-card.selected::after,
.page-template-page-diagnostic .diag-concern-card.selected::after{
  content:"✓"; position:absolute; top:10px; right:10px; width:22px; height:22px; border-radius:50%;
  display:grid; place-items:center; font-size:12px; font-weight:700; color:#fff; background:#BF964B;
}
.page-template-page-diagnostic .diag-opt-wide.selected .arrow{ opacity:1; }
.page-template-page-diagnostic .diag-opt-pill{ transition:border-color .2s, background .2s, box-shadow .2s; }
.page-template-page-diagnostic .diag-opt-pill.selected{ box-shadow:0 8px 18px -12px rgba(191,150,75,.9); }

/* Boutons */
.page-template-page-diagnostic .diag-next,
.page-template-page-diagnostic .diag-intro .btn,
.page-template-page-diagnostic .diag-result .btn{ border-radius:12px; }
.page-template-page-diagnostic .diag-result input[type="email"]{ border-radius:12px; }

/* Résultat */
.page-template-page-diagnostic .diag-result{ border-radius:22px; }

@media (prefers-reduced-motion:reduce){
  .page-template-page-diagnostic .diag-opt-card,
  .page-template-page-diagnostic .diag-opt-wide,
  .page-template-page-diagnostic .diag-concern-card{ transition:none; transform:none !important; }
}

/* ---- v0.8 ---- */
/* Bouton Retour */
.page-template-page-diagnostic .diag-screen{ position:relative; }
.page-template-page-diagnostic .oph-diag-back{
  display:inline-flex; align-items:center; gap:4px; margin:0 0 6px; padding:6px 10px 6px 4px;
  background:none; border:0; border-radius:10px; cursor:pointer;
  font:500 13px/1 inherit; letter-spacing:.02em; color:#001E45; opacity:.72; transition:opacity .2s, background .2s;
}
.page-template-page-diagnostic .oph-diag-back:hover{ opacity:1; background:rgba(0,30,69,.05); }
.page-template-page-diagnostic .diag-app.oph-busy .diag-screen{ opacity:.35; pointer-events:none; transition:opacity .15s; }

/* Focus clavier visible */
.page-template-page-diagnostic .diag-app button:focus-visible,
.page-template-page-diagnostic .diag-app a:focus-visible{ outline:2px solid #BF964B; outline-offset:3px; }

/* Titres des préoccupations : pas de césure automatique (« EX-CÈS ») */
.page-template-page-diagnostic .diag-concern-card .concern-body h3{
  -webkit-hyphens:manual; hyphens:manual; overflow-wrap:normal; word-break:normal; font-size:11px; letter-spacing:.02em; line-height:1.45;
}

/* Résultat : fiches produit avec visuel */
.page-template-page-diagnostic .diag-result-products{ grid-template-columns:1fr !important; max-width:520px; }
.page-template-page-diagnostic .diag-product-card{ border-radius:14px; border-color:rgba(0,30,69,.1); }
.page-template-page-diagnostic .diag-product-card.oph-dp{ display:flex; gap:14px; align-items:flex-start; padding:14px; }
.page-template-page-diagnostic .oph-dp__img{ flex:0 0 80px; width:80px; height:80px; border-radius:10px; overflow:hidden; background:#F4F1EA; display:block; }
.page-template-page-diagnostic .oph-dp__img img{ width:100%; height:100%; object-fit:cover; display:block; }
.page-template-page-diagnostic .oph-dp__body{ flex:1 1 auto; min-width:0; }
.page-template-page-diagnostic .oph-dp__link{
  display:inline-block; margin-top:8px; font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
  color:#001E45; text-decoration:none; border-bottom:1px solid #BF964B; padding-bottom:2px;
}
.page-template-page-diagnostic .oph-dp__link:hover{ color:#BF964B; }
.page-template-page-diagnostic .diag-support-tag{ border-radius:999px; }
.page-template-page-diagnostic a.oph-tag-link{ text-decoration:none; transition:border-color .2s, color .2s; }
.page-template-page-diagnostic a.oph-tag-link:hover{ border-color:#BF964B; color:#BF964B; }
.page-template-page-diagnostic .diag-step-pill{ border-radius:999px; }

/* « À noter » : encadré lisible au lieu d'un italique flottant */
.page-template-page-diagnostic .diag-result-precaution p{
  max-width:520px; margin:10px auto 0; padding:14px 16px; border-radius:12px; text-align:left;
  background:#FBF7EF; border:1px solid rgba(191,150,75,.35); font-style:normal; color:#3a4658;
}
.page-template-page-diagnostic .diag-result-precaution p{ margin-bottom:18px; }
.page-template-page-diagnostic .diag-result-actions .btn{ border-radius:12px !important; max-width:100%; box-sizing:border-box; }

/* ---- v0.9 : mise en page « grande marque » ---- */
/* Intro : sans doublon du titre de page, carte claire et lisible */
.page-template-page-diagnostic .diag-app.oph-at-intro .diag-progress,
.page-template-page-diagnostic .diag-app.oph-at-intro .diag-stage-label{ display:none; }
.page-template-page-diagnostic .diag-intro{
  background:#FBF8F2; border:1px solid rgba(191,150,75,.28); box-shadow:0 30px 60px -40px rgba(0,30,69,.45);
  max-width:560px; margin:0 auto; padding:40px 32px;
}
.page-template-page-diagnostic .diag-intro > .eyebrow,
.page-template-page-diagnostic .diag-intro > h2{ display:none; }
.page-template-page-diagnostic .diag-intro > p{ color:#3a4658; font-size:15px; margin-bottom:22px; }
.page-template-page-diagnostic .oph-get{ list-style:none; margin:0 auto 24px; padding:0; max-width:340px; display:grid; gap:10px; text-align:left; }
.page-template-page-diagnostic .oph-get li{
  display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:12px; background:#fff;
  border:1px solid rgba(0,30,69,.08); color:#001E45; font-size:14px; font-weight:500;
}
.page-template-page-diagnostic .oph-get svg{ color:#BF964B; flex:0 0 20px; }
.page-template-page-diagnostic .diag-intro .diag-trust-row{ color:#5b6676; }
.page-template-page-diagnostic .diag-intro .diag-trust-row span{ color:#5b6676; }
.page-template-page-diagnostic .diag-intro .diag-trust-row svg{ color:#BF964B; }
.page-template-page-diagnostic .diag-intro [data-start]{ width:100%; max-width:340px; padding-top:16px; padding-bottom:16px; }

/* Q1 : repère sous chaque type de peau */
.page-template-page-diagnostic .diag-opt-card{ gap:6px; padding:22px 12px 18px; }
.page-template-page-diagnostic .diag-opt-card .icon{ margin-bottom:6px; }
.page-template-page-diagnostic .oph-opt-label{ font-size:15px; font-weight:500; color:#001E45; }
.page-template-page-diagnostic .oph-hint{ font-size:11.5px; line-height:1.4; color:#6b7584; text-align:center; }

/* Analyse : récapitulatif des réponses */
.page-template-page-diagnostic .oph-recap{ list-style:none; margin:22px auto 0; padding:0; display:grid; gap:10px; max-width:300px; text-align:left; }
.page-template-page-diagnostic .oph-recap li{
  display:flex; align-items:center; gap:10px; font-size:13.5px; color:#001E45;
  opacity:0; transform:translateY(4px); animation:ophIn .35s ease forwards;
}
.page-template-page-diagnostic .oph-recap svg{ color:#fff; background:#BF964B; border-radius:50%; padding:3px; width:20px; height:20px; flex:0 0 20px; }
@keyframes ophIn{ to{ opacity:1; transform:none; } }

/* Résultat : bloc priorité */
.page-template-page-diagnostic .oph-prio{
  background:#001E45; border-radius:18px; padding:28px 22px; margin:6px auto 4px; max-width:560px; color:#fff;
}
.page-template-page-diagnostic .oph-prio .eyebrow{ color:#D5B274; }
.page-template-page-diagnostic .oph-prio .diag-result-system{ color:#fff; margin:8px 0 12px; }
.page-template-page-diagnostic .oph-prio .diag-result-reason{ color:#dde1ea; margin:0; }

/* Résultat : routine en cartes Matin / Soir, étapes numérotées */
.page-template-page-diagnostic .diag-result-protocol{ display:grid; grid-template-columns:1fr; gap:12px; max-width:560px; margin:14px auto 30px; }
@media (min-width:600px){ .page-template-page-diagnostic .diag-result-protocol{ grid-template-columns:1fr 1fr; } }
.page-template-page-diagnostic .diag-result-protocol-period{
  align-items:stretch; background:#fff; border:1px solid rgba(0,30,69,.1); border-radius:14px; padding:16px 18px; gap:12px;
}
.page-template-page-diagnostic .diag-result-protocol-period[hidden]{ display:none; }
.page-template-page-diagnostic .diag-result-protocol-label{ display:flex; align-items:center; gap:8px; color:#001E45; }
.page-template-page-diagnostic .diag-result-protocol-label svg{ color:#BF964B; }
.page-template-page-diagnostic .diag-result-steps{ display:flex; flex-direction:column; gap:8px; counter-reset:ophs; align-items:stretch; }
.page-template-page-diagnostic .diag-step-arrow{ display:none; }
.page-template-page-diagnostic .diag-step-pill{
  display:flex; align-items:center; gap:12px; border:0; border-radius:0; background:none; padding:0;
  font-size:12px; letter-spacing:.1em; color:#001E45; text-align:left;
}
.page-template-page-diagnostic .diag-step-pill::before{
  counter-increment:ophs; content:counter(ophs);
  display:grid; place-items:center; width:26px; height:26px; flex:0 0 26px; border-radius:50%;
  border:1px solid #BF964B; color:#BF964B; font-size:11px; letter-spacing:0; font-weight:600;
}

/* CTA principal juste après les produits ; actions finales nettes */
.page-template-page-diagnostic .oph-cta-main{ text-align:center; margin:-8px auto 28px; max-width:520px; }
.page-template-page-diagnostic .oph-cta-main .btn,
.page-template-page-diagnostic .diag-result-actions .btn{
  display:inline-flex; align-items:center; justify-content:center; width:100%; max-width:520px; box-sizing:border-box;
  white-space:normal; text-align:center; line-height:1.35; letter-spacing:.1em; padding:16px 18px; border-radius:12px !important;
}
.page-template-page-diagnostic .diag-result-email{ max-width:520px; margin-left:auto; margin-right:auto; }
.page-template-page-diagnostic .diag-result-protocol .diag-result-steps{ margin-bottom:0; }
.page-template-page-diagnostic .oph-prio{ margin-bottom:28px; }
.page-template-page-diagnostic .diag-intro .diag-trust-row{ gap:8px 16px; margin-bottom:24px; }
.page-template-page-diagnostic .diag-intro .diag-trust-row span{ white-space:nowrap; }
@media (max-width:420px){
  .page-template-page-diagnostic .diag-intro{ padding:30px 18px; }
  .page-template-page-diagnostic .diag-intro .diag-trust-row{ gap:8px 12px; font-size:10.5px; }
  .page-template-page-diagnostic .diag-intro .diag-trust-row svg{ width:14px; height:14px; flex-basis:14px; }
}
/* v0.10 — mention « orientation cosmétique, non médicale » sous le résultat */
.page-template-page-diagnostic .oph-notice{
  max-width:560px; margin:-14px auto 28px; font-size:12px; line-height:1.55; color:#6b7584; text-align:center;
}
/* v0.10 — produits non vérifiés retirés du résultat (audit 29/10) */
.page-template-page-diagnostic .diag-result .oph-off,
.page-template-page-diagnostic .diag-result .diag-result-support-products{ display:none !important; }