@import url("/templates/joomspirit_134/css/custom/BLOC 40_PAGES ACCOMPAGNEMENT.css");
@import url("/templates/joomspirit_134/css/custom/BLOC 41_CONNAISSANCE DE SOI.css");


/* ==========================================================================
   PATCH — Page gestion des émotions
   URL : /accompagnements/gestion-emotions
   Scope : .tc-emotions-page
   ========================================================================== */

.tc-emotions-page{
  --emo-main:#2b7a8b;
  --emo-soft:#b7e0e2;
  --emo-gold:#d5a76e;
  --emo-blue:#1b3c5f;
  --emo-paper:#fffdf8;
  --emo-line:rgba(31,46,59,.12);
  --emo-shadow:0 12px 30px rgba(31,46,59,.06);

  max-width:980px;
  margin:0 auto 3rem;
}

/* Hero */
.tc-emotions-page .page-hero--emotions{
  margin:0 0 1.4rem;
  padding:1.45rem 1.55rem;
  border:1px solid var(--emo-line);
  border-left:6px solid var(--emo-main);
  border-radius:20px;
  background:
    radial-gradient(circle at 94% 0%, rgba(183,224,226,.38), transparent 36%),
    linear-gradient(180deg,#fff 0%,#f7fbfb 100%);
  box-shadow:var(--emo-shadow);
}

.tc-emotions-page .page-hero--emotions h1{
  margin-top:.25rem !important;
  color:var(--emo-main);
  font-size:clamp(1.55rem,3vw,2.25rem);
  line-height:1.22;
}

.tc-emotions-page .tc-kicker{
  margin:0 0 .35rem;
  color:#567b7c;
  font-size:.78rem;
  font-weight:850;
  letter-spacing:.08em;
  text-transform:uppercase;
}

/* Notes */
.tc-emotions-page .soft-note{
  margin:1rem 0;
  padding:1rem 1.1rem;
  border:1px solid rgba(43,122,139,.14);
  border-left:5px solid var(--emo-main);
  border-radius:16px;
  background:rgba(255,255,255,.92);
  box-shadow:0 8px 20px rgba(31,46,59,.045);
}

.tc-emotions-page .tc-note-title{
  margin:0 0 .35rem;
  color:var(--emo-main);
  font-weight:850;
}

/* Boutons */
.tc-emotions-page .tc-linkset{
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
  margin-top:.85rem;
}

.tc-emotions-page .tc-link,
.tc-emotions-page .btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:.62rem .95rem;
  border-radius:999px;
  border:1px solid rgba(43,122,139,.18);
  background:var(--emo-main);
  color:#fff !important;
  font-weight:800;
  text-decoration:none !important;
}

.tc-emotions-page .tc-link:hover,
.tc-emotions-page .btn:hover{
  background:var(--emo-gold);
  color:#1b2638 !important;
}

/* Sections */
.tc-emotions-page section,
.tc-emotions-page .encart-dossier,
.tc-emotions-page .note{
  margin:1.2rem 0;
  padding:1.15rem;
  border:1px solid var(--emo-line);
  border-radius:18px;
  background:var(--emo-paper);
  box-shadow:0 10px 26px rgba(31,46,59,.05);
}

.tc-emotions-page section h2{
  color:var(--emo-main);
}

/* Listes check */
.tc-emotions-page ul.check{
  list-style:none;
  padding-left:0;
}

.tc-emotions-page ul.check li{
  position:relative;
  padding-left:1.45rem;
  margin:.42rem 0;
}

.tc-emotions-page ul.check li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:0;
  color:var(--emo-main);
  font-weight:900;
}

/* Montage respiration */
.tc-emotions-page .tc-breath-montage{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.85rem;
  margin:1.35rem 0;
}

.tc-emotions-page .tc-breath-frame{
  margin:0;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 12px 28px rgba(31,46,59,.12);
}

.tc-emotions-page .tc-breath-frame img{
  display:block;
  width:100%;
  height:auto;
}

/* FAQ */
.tc-emotions-page .faq-section{
  margin:0;
}

.tc-emotions-page .faq-item{
  margin:.65rem 0;
  border:1px solid rgba(43,122,139,.14);
  border-radius:14px;
  background:#fff;
  overflow:hidden;
}

.tc-emotions-page .faq-item summary{
  cursor:pointer;
  padding:.85rem 2.6rem .85rem 1rem;
  color:var(--emo-main);
  font-weight:850;
  list-style:none;
  position:relative;
}

.tc-emotions-page .faq-item summary::-webkit-details-marker{
  display:none;
}

.tc-emotions-page .faq-item summary::after{
  content:"+";
  position:absolute;
  right:.9rem;
  top:.75rem;
  width:1.55rem;
  height:1.55rem;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--emo-main);
  color:#fff;
  font-weight:900;
}

.tc-emotions-page .faq-item[open] summary::after{
  content:"−";
  background:var(--emo-gold);
  color:#1b2638;
}

.tc-emotions-page .faq-answer{
  padding:0 1rem 1rem;
}

.tc-emotions-page .faq-contact-soft{
  margin-top:1rem;
  padding:1rem;
  border-radius:16px;
  border-left:5px solid #9b3b3b;
  background:#fff8f6;
}

/* Étapes */
.tc-emotions-page .accompagnement-steps{
  counter-reset:step;
  list-style:none;
  padding-left:0;
}

.tc-emotions-page .accompagnement-steps li{
  counter-increment:step;
  margin:.75rem 0;
  padding:1rem;
  border:1px solid rgba(43,122,139,.14);
  border-radius:16px;
  background:#fff;
}

.tc-emotions-page .accompagnement-steps li h3::before{
  content:counter(step) ". ";
  color:var(--emo-main);
  font-weight:900;
}

/* Effets + témoignages */
.tc-emotions-page .effets-temoignages{
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(260px,.8fr);
  gap:1rem;
  margin:1.2rem 0;
}

.tc-emotions-page .effets-tags{
  display:flex;
  flex-wrap:wrap;
  gap:.42rem;
  list-style:none;
  padding:0;
}

.tc-emotions-page .effets-tags li{
  padding:.24rem .65rem;
  border-radius:999px;
  background:#eefafa;
  border:1px solid rgba(43,122,139,.14);
  color:var(--emo-main);
  font-weight:750;
  font-size:.85rem;
}

.tc-emotions-page .temoignages-accompagnement{
  padding:1.1rem;
  border:1px solid rgba(31,46,59,.12);
  border-left:5px solid var(--emo-gold);
  border-radius:18px;
  background:#fff;
  box-shadow:0 10px 26px rgba(31,46,59,.05);
}

/* Sortie */
.tc-emotions-page .tc-reg-exit{
  border-left-color:var(--emo-main);
}

/* Mobile */
@media(max-width:760px){
  .tc-emotions-page .page-hero--emotions{
    padding:1.05rem;
    border-radius:16px;
  }

  .tc-emotions-page .tc-breath-montage,
  .tc-emotions-page .effets-temoignages{
    grid-template-columns:1fr;
  }

  .tc-emotions-page section,
  .tc-emotions-page .encart-dossier,
  .tc-emotions-page .note{
    padding:1rem;
    border-radius:16px;
  }

  .tc-emotions-page .tc-link,
  .tc-emotions-page .btn{
    width:100%;
  }
}