@charset "UTF-8";

/* ==========================================================================
   PAGE — Effets et changements avec l’hypnose
   Fichier : page-effets.css
   ========================================================================== */

.effets-page,
.tc-effets{
  max-width: 980px;
  margin: 0 auto 3.5rem;
  color: #24313f;
}

/* HERO / INTRO */

.effets-page .intro-section,
.tc-effets .page-hero{
  margin: 0 0 2rem;
  padding: 2rem;
  border-radius: 24px;
  background:
    radial-gradient(circle at top left, rgba(119, 91, 154, .12), transparent 42%),
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(246,242,250,.92));
  border: 1px solid rgba(76, 54, 107, .13);
  box-shadow: 0 18px 45px rgba(32, 27, 45, .08);
}

.effets-page h1,
.tc-effets h1{
  margin: 0 0 1rem !important;
  color: #2f2440;
  line-height: 1.12;
}

.effets-page .lead,
.tc-effets .lead{
  font-size: 1.08rem;
  line-height: 1.75;
  color: #3f4b57;
  margin: .7rem 0 0;
}

/* NOTE D’INTENTION */

.tc-effets-note,
.effets-page .info-note,
.effets-page .note,
.tc-effets .note{
  margin: 1.2rem 0;
  padding: 1rem 1.15rem;
  border-left: 4px solid #7b5fa4;
  border-radius: 14px;
  background: rgba(123, 95, 164, .08);
  color: #374354;
}

/* SOMMAIRE */

.tc-effets .accompagnement-toc,
.effets-page .accompagnement-toc{
  margin: 1.8rem 0 2.4rem;
}

/* SECTIONS */

.effets-page .effets-section,
.tc-effets section{
  margin: 1.8rem 0;
  padding: 1.55rem;
  border-radius: 20px;
  background: rgba(255,255,255,.88);
  border: 1px solid rgba(36,49,63,.10);
  box-shadow: 0 10px 28px rgba(36,49,63,.055);
}

.effets-page .effets-section h2,
.tc-effets section h2{
  margin: 0 0 .9rem !important;
  color: #2f2440;
  font-size: 1.45rem;
  line-height: 1.22;
}

.effets-page .effets-section h3,
.tc-effets section h3{
  margin: 1.2rem 0 .55rem;
  color: #45315f;
  font-size: 1.1rem;
}

.effets-page p,
.tc-effets p{
  line-height: 1.75;
}

.effets-page ul,
.tc-effets ul{
  margin: .8rem 0 1.1rem 1.25rem;
  padding: 0;
}

.effets-page li,
.tc-effets li{
  margin: .42rem 0;
  line-height: 1.65;
}

/* CARTES / GRILLES */

.tc-effets-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin: 1.2rem 0;
}

.tc-effets-card{
  padding: 1.15rem;
  border-radius: 18px;
  background: linear-gradient(180deg, #fff, rgba(248,246,251,.95));
  border: 1px solid rgba(76,54,107,.12);
}

.tc-effets-card h3{
  margin-top: 0 !important;
}

/* LISTES DE CONTEXTES */

.tc-effets-contextes{
  display: grid;
  gap: .8rem;
  margin: 1.2rem 0;
}

.tc-effets-contextes li{
  padding: .85rem 1rem;
  border-radius: 15px;
  background: rgba(246,242,250,.85);
  border: 1px solid rgba(76,54,107,.10);
  list-style-position: inside;
}

/* ACCORDÉONS */

.tc-effets details,
.effets-page details{
  margin: .85rem 0;
  border-radius: 16px;
  border: 1px solid rgba(36,49,63,.13);
  background: #fff;
  overflow: hidden;
}

.tc-effets summary,
.effets-page summary{
  position: relative;
  cursor: pointer;
  list-style: none;
  padding: 1rem 3rem 1rem 1.1rem;
  font-weight: 800;
  color: #2f2440;
}

.tc-effets summary::-webkit-details-marker,
.effets-page summary::-webkit-details-marker{
  display: none;
}

.tc-effets summary::after,
.effets-page summary::after{
  content: "+";
  position: absolute;
  right: 1rem;
  top: 50%;
  width: 1.55rem;
  height: 1.55rem;
  transform: translateY(-50%);
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: rgba(123,95,164,.12);
  color: #45315f;
  font-weight: 900;
}

.tc-effets details[open] summary::after,
.effets-page details[open] summary::after{
  content: "−";
}

.tc-effets details > *:not(summary),
.effets-page details > *:not(summary){
  padding: 0 1.1rem 1rem;
}

/* LIENS / CTA */

.effets-page a,
.tc-effets a{
  color: #604885;
  text-decoration-thickness: 1px;
  text-underline-offset: .18em;
}

.effets-page a:hover,
.tc-effets a:hover{
  color: #3d2b5c;
  text-decoration-thickness: 2px;
}

.tc-effets .tc-linkset,
.effets-page .tc-linkset{
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: 1.2rem;
}

.tc-effets .tc-link,
.effets-page .tc-link{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .78rem 1rem;
  border-radius: 999px;
  background: #604885;
  color: #fff !important;
  text-decoration: none;
  font-weight: 800;
  box-shadow: 0 10px 24px rgba(76,54,107,.16);
}

.tc-effets .tc-link:hover,
.effets-page .tc-link:hover{
  background: #45315f;
}

/* SORTIE / MAILLAGE */

.effets-page .effets-liens,
.tc-effets .tc-effets-sortie{
  margin-top: 2.4rem;
  background:
    linear-gradient(135deg, rgba(47,36,64,.96), rgba(96,72,133,.93));
  color: #fff;
  border: 0;
}

.effets-page .effets-liens h2,
.tc-effets .tc-effets-sortie h2{
  color: #fff;
}

.effets-page .effets-liens a,
.tc-effets .tc-effets-sortie a{
  color: #fff;
}

/* RESPONSIVE */

@media (max-width: 768px){
  .effets-page,
  .tc-effets{
    max-width: 100%;
    margin-bottom: 2.5rem;
  }

  .effets-page .intro-section,
  .tc-effets .page-hero,
  .effets-page .effets-section,
  .tc-effets section{
    padding: 1.15rem;
    border-radius: 18px;
  }

  .tc-effets-grid{
    grid-template-columns: 1fr;
  }

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

/* ==========================================================================
   CORRECTIFS — Sommaire + CTA plus sobres
   ========================================================================== */

/* Sommaire */
.tc-effets .accompagnement-toc,
.effets-page .accompagnement-toc{
  padding: 1.15rem 1.25rem;
  border-radius: 18px;
  background: rgba(255,255,255,.88);
  border: 1px solid rgba(76,54,107,.12);
  box-shadow: 0 8px 22px rgba(36,49,63,.055);
}

.tc-effets .toc-title,
.effets-page .toc-title{
  margin: 0 0 .85rem;
  font-weight: 900;
  color: #2f2440;
  letter-spacing: .02em;
}

.tc-effets .toc-block,
.effets-page .toc-block{
  margin-top: .9rem;
}

.tc-effets .toc-block-title,
.effets-page .toc-block-title{
  margin: 0 0 .45rem;
  font-size: .92rem;
  font-weight: 850;
  color: #604885;
}

.tc-effets .accompagnement-toc ul,
.effets-page .accompagnement-toc ul{
  margin: 0;
  padding: 0;
  list-style: none;
}

.tc-effets .accompagnement-toc li,
.effets-page .accompagnement-toc li{
  margin: .32rem 0;
}

.tc-effets .accompagnement-toc a,
.effets-page .accompagnement-toc a{
  display: inline-block;
  padding: .2rem 0;
  color: #374354;
  text-decoration: none;
  border-bottom: 1px solid rgba(96,72,133,.22);
}

.tc-effets .accompagnement-toc a:hover,
.effets-page .accompagnement-toc a:hover{
  color: #604885;
  border-bottom-color: rgba(96,72,133,.55);
}

/* CTA plus discrets */
.tc-effets .tc-link,
.effets-page .tc-link{
  padding: .55rem .85rem;
  border-radius: 999px;
  background: rgba(96,72,133,.08);
  color: #4b376c !important;
  border: 1px solid rgba(96,72,133,.22);
  box-shadow: none;
  font-weight: 800;
  font-size: .94rem;
}

.tc-effets .tc-link:hover,
.effets-page .tc-link:hover{
  background: rgba(96,72,133,.14);
  color: #2f2440 !important;
  border-color: rgba(96,72,133,.38);
}

/* Mobile : éviter les gros boutons pleine largeur */
@media (max-width: 768px){
  .tc-effets .tc-link,
  .effets-page .tc-link{
    width: auto;
    max-width: 100%;
  }

  .tc-effets .tc-linkset,
  .effets-page .tc-linkset{
    gap: .5rem;
  }
}

/* Sommaire — ciblage renforcé page effets */
.tc-effets nav[aria-label*="Sommaire"],
.effets-page nav[aria-label*="Sommaire"],
.tc-effets .tc-toc-hub,
.effets-page .tc-toc-hub,
.tc-effets .accompagnement-toc,
.effets-page .accompagnement-toc{
  margin: 1.8rem 0 2.4rem;
  padding: 1.15rem 1.25rem;
  border-radius: 18px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(76,54,107,.14);
  box-shadow: 0 8px 22px rgba(36,49,63,.06);
}

.tc-effets nav[aria-label*="Sommaire"] p,
.effets-page nav[aria-label*="Sommaire"] p{
  margin-top: 0;
}

.tc-effets nav[aria-label*="Sommaire"] ul,
.effets-page nav[aria-label*="Sommaire"] ul{
  margin: .6rem 0 0;
  padding-left: 0;
  list-style: none;
}

.tc-effets nav[aria-label*="Sommaire"] li,
.effets-page nav[aria-label*="Sommaire"] li{
  margin: .35rem 0;
}

.tc-effets nav[aria-label*="Sommaire"] a,
.effets-page nav[aria-label*="Sommaire"] a{
  display: inline-block;
  padding: .22rem 0;
  color: #374354;
  text-decoration: none;
  border-bottom: 1px solid rgba(96,72,133,.22);
}

.tc-effets nav[aria-label*="Sommaire"] a:hover,
.effets-page nav[aria-label*="Sommaire"] a:hover{
  color: #604885;
  border-bottom-color: rgba(96,72,133,.55);
}