/* =========================
   coursdetail-premium.css (CLEAN + FULL WIDTH OK)
   ========================= */

:root{
  --kk-violet:#2E1A8A;
  --kk-orange:#FCA203;

  --kk-ink:#0B1220;
  --kk-muted:#5B6475;

  --kk-bg:#F6F8FC;

  --kk-border: rgba(11,18,32,.10);
  --kk-border2: rgba(11,18,32,.06);

  --radius-xl: 26px;
  --radius-lg: 20px;

  --shadow-xl: 0 26px 70px rgba(11,18,32,.10);
  --shadow-lg: 0 16px 40px rgba(11,18,32,.10);
  --shadow-md: 0 10px 24px rgba(11,18,32,.08);

  --pad: 22px;
  --pad-lg: 30px;
}

/* ===== base ===== */
html, body{
  width:100%;
  max-width:100%;
  overflow-x:hidden; /* évite l’overflow quand fullbleed */
}

body{
  background:
    radial-gradient(900px 420px at 10% 0%, rgba(46,26,138,.10), transparent 60%),
    radial-gradient(780px 420px at 90% 10%, rgba(252,162,3,.10), transparent 55%),
    var(--kk-bg);
  color: var(--kk-ink);
}

@media (min-width: 1200px){
  .container{ max-width: 1120px; }
}

.kk-bottom-pad{ padding-bottom: 98px; }
@media (min-width: 992px){ .kk-bottom-pad{ padding-bottom: 92px; } }

/* ===== typography ===== */
.kk-eyebrow{
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-size: .78rem;
  color: rgba(46,26,138,.85);
}

.kk-h1{
  font-weight: 950;
  letter-spacing: -.035em;
  line-height: 1.05;
  font-size: clamp(1.8rem, 2.3vw, 2.55rem);
  margin: .45rem 0 .8rem 0;
}

.kk-lead{
  color: var(--kk-muted);
  font-size: 1.05rem;
  line-height: 1.55;
}

.kk-section-title{
  font-weight: 950;
  letter-spacing: -.03em;
  color: var(--kk-ink);
}

.kk-subtitle{ color: var(--kk-muted); line-height: 1.55; }

.kk-mini{
  color: var(--kk-muted);
  font-size: .92rem;
  line-height: 1.4;
}

/* ===== hero ===== */
.kk-hero{
  border-radius: var(--radius-xl);
  border: 1px solid var(--kk-border2);
  background:
    linear-gradient(135deg, rgba(255,255,255,.92), rgba(255,255,255,.78)),
    radial-gradient(900px 400px at 0% 0%, rgba(46,26,138,.12), transparent 60%),
    radial-gradient(900px 400px at 100% 0%, rgba(252,162,3,.12), transparent 60%);
  box-shadow: var(--shadow-xl);
  overflow:hidden;
  position: relative;
  z-index: 1;
}

.kk-hero-pad{ padding: 24px; }
@media(min-width:768px){ .kk-hero-pad{ padding: 38px; } }

.kk-proofline{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top: 14px;
}

.kk-pill{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.55rem .9rem;
  border-radius: 999px;
  border: 1px solid var(--kk-border2);
  background: rgba(255,255,255,.85);
  box-shadow: 0 10px 22px rgba(11,18,32,.06);
  font-weight: 850;
  font-size: .86rem;
}

/* ===== cards ===== */
.kk-card{
  background: rgba(255,255,255,.92);
  border: 1px solid var(--kk-border2);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  position: relative;
  z-index: 1;
}

.kk-card-pad{ padding: var(--pad); }
@media (min-width: 768px){ .kk-card-pad{ padding: var(--pad-lg); } }

.kk-img{
  width:100%;
  border-radius: var(--radius-lg);
  border: 1px solid var(--kk-border2);
  box-shadow: var(--shadow-lg);
  object-fit: cover;
}

/* ===== buttons ===== */
.btn.kk-cta,
.btn.kk-outline{
  border-radius: 16px;
  min-height: 56px;
  font-weight: 950;
  letter-spacing: -.01em;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.kk-cta{
  background: linear-gradient(135deg, #2E1A8A, #3E22C0) !important;
  border: 0 !important;
  color:#fff!important;
  box-shadow: 0 18px 38px rgba(46,26,138,.26);
}
.kk-cta:hover{ transform: translateY(-1px); filter: brightness(1.02); }

.kk-outline{
  background: rgba(255,255,255,.9)!important;
  border: 1px solid rgba(46,26,138,.25)!important;
  color: #2E1A8A !important;
}
.kk-outline:hover{ background: rgba(46,26,138,.05)!important; }

/* ===== sections ===== */
.kk-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
@media(min-width:768px){
  .kk-grid{ grid-template-columns: repeat(2, 1fr); }
}

.kk-feature{
  border: 1px solid var(--kk-border2);
  border-radius: 18px;
  background: rgba(255,255,255,.85);
  padding: 16px;
}
.kk-feature .t{ font-weight: 950; letter-spacing: -.02em; margin-bottom: 6px; }
.kk-feature .d{ color: var(--kk-muted); }

@media (min-width: 992px){
  .kk-sticky-right{ position: sticky; top: 92px; z-index: 2; }
}

/* ===== sticky bottom bar ===== */
.kk-stickybar{
  position: fixed;
  left: 0; right: 0; bottom: 0;
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(14px);
  border-top: 1px solid var(--kk-border2);
  box-shadow: 0 -18px 38px rgba(11,18,32,.10);
  z-index: 9999;
  padding: .85rem 0;
}

.kk-price{ font-weight: 950; font-size: 1.15rem; white-space: nowrap; }
.kk-price-old{
  color: rgba(11,18,32,.45);
  text-decoration: line-through;
  font-weight: 900;
  margin-left: .45rem;
  white-space: nowrap;
}

.kk-divider{ height:1px; background: rgba(11,18,32,.08); margin: 18px 0; }

.kk-note{
  border-left: 4px solid rgba(252,162,3,.9);
  padding-left: 12px;
  color: var(--kk-muted);
}

.kk-modal{ border-radius: 22px; }

/* =========================
   FULLBLEED (robuste)
   ========================= */
.kk-fullbleed{
  position: relative;
  left: 50%;
  width: 100vw;
  margin-left: -50vw;
  padding: 56px 0;
}

/* =========================
   FAQ FULL WIDTH (violet)
   ========================= */
.kk-fullbleed-faq{
  background:
    radial-gradient(900px 420px at 10% 0%, rgba(255,255,255,.12), transparent 60%),
    radial-gradient(780px 420px at 90% 10%, rgba(252,162,3,.14), transparent 55%),
    #2E1A8A !important;
  border-top: 2px solid rgba(255,255,255,.18) !important;
  border-bottom: 2px solid rgba(255,255,255,.18) !important;
}

/* bulldozer containers internes faq */
.kk-fullbleed-faq .container,
.kk-fullbleed-faq .container-fluid,
.kk-fullbleed-faq .container-lg,
.kk-fullbleed-faq .container-md,
.kk-fullbleed-faq .container-sm,
.kk-fullbleed-faq .container-xl,
.kk-fullbleed-faq .container-xxl{
  max-width: 1120px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
}

.kk-fullbleed-faq,
.kk-fullbleed-faq *{ color:#fff !important; }

.kk-fullbleed-faq .card,
.kk-fullbleed-faq .kk-card,
.kk-fullbleed-faq .accordion,
.kk-fullbleed-faq .accordion-item,
.kk-fullbleed-faq .accordion-button,
.kk-fullbleed-faq .accordion-body{
  background: transparent !important;
  border-color: rgba(255,255,255,.22) !important;
  box-shadow: none !important;
}
.kk-fullbleed-faq a{ color:#fff !important; text-decoration: underline; }

/* =========================
   NEWSLETTER FULL WIDTH (violet)
   ========================= */
.kk-fullbleed-news{
  background: #330394 !important;
  border-top: 1px solid rgba(255,255,255,.12);
  padding: 56px 0;
}

/* IMPORTANT: on ne casse pas la mise en page du partial, on le laisse respirer */
.kk-fullbleed-news #newsletter{
  background: transparent !important;
}

/* =========================
   FOOTER FULL WIDTH
   ========================= */
.kk-fullbleed-footer{
  background: #0B1220;
  color: #fff;
  padding: 0;
}

/* meta chips (moins d’icônes -> on peut les garder sans <i>) */
.kk-meta-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top: 14px;
}

.kk-meta-chip{
  display:inline-flex;
  align-items:center;
  padding:.55rem .9rem;
  border-radius:999px;
  border:1px solid rgba(11,18,32,.10);
  background: rgba(255,255,255,.86);
  box-shadow: 0 10px 22px rgba(11,18,32,.06);
  font-weight: 900;
  font-size: .86rem;
  color: #0B1220;
}

/* select clean */
#sessionSelect{
  min-height: 56px;
  border-radius: 16px;
  border: 1px solid rgba(11,18,32,.12);
  background: rgba(255,255,255,.92);
  font-weight: 850;
}