:root {
--sage: #c8d8d4;
--sage-light: #e4eeec;
--purple: #7b5ea7;
--purple-light: #a98fd4;
--ink: #1a1a1a;
--ink-soft: #3d3d3d;
--muted: #6b6b6b;
--white: #ffffff;
--border: #c5c5c5;
}

body {
	font-family:system-ui;
	background:#f4f6f8;
	margin:0;
	color:#222
}
.header-container {
	position: fixed;
	width: 100%;
	background-color: #fff;
	align-items: center;
	justify-content: center;
	display: flex;
	gap: 10px;
	top: 0;
	z-index: 1;
}
.header-logo{
	overflow: hidden;
	width: 140px;
	height: 153px;
	margin: -35px 0 0 0px;
}
.header-box{
	color:#A47DAB;
	text-align:center;
	justify-content: center;
}
img.logo-img {
	position: relative;
	z-index: 1;
	width: 140px;
	height: 153px;
}
.logo-title-container{
	overflow: hidden;
	width: 400px;
	height: 100px;
	margin: -10px 0px 0px 0px;
	padding-left: 51px;
}
img.logo-title {
	position: relative;
	z-index: 1;
	width: 400px;
	height: 436px;
}
img.img-right {
	float: right;
	max-width: 300px;
	height: auto;
	object-fit: contain;
}

/* Mobile: stack everything, image between heading and text */
@media (max-width: 600px) {
  body {
    display: flex;
    flex-direction: column;
  }

  img.img-right {
    float: none;        /* kill the float */
    width: 100%;        /* full width */
    margin: 0 0 1rem 0;
    order: 2;           /* heading=1 (default), image=2, paragraph=3 */
  }

  h2   { order: 1; }
  p    { order: 3; }
}

.img-courses {
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
}
.img-courses img {
	display: block;
	width: auto;
	height: auto;
	max-width: none;
	min-width: 1084px;
}
nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 1.5rem;
  height: 56px;
  background: #fff;
  border-bottom: 1px solid #eee;
  position: relative;
}
.nav-links { display: flex; gap: 4px; }
.nav-links a {
  color: #A47DAB;
  font-weight:500;
  margin:0 1rem;
  text-decoration: none;
  padding: 6px 12px;
  border-radius: 6px;
}
.nav-links a:hover { 
	text-decoration:underline
}
.div-burger-btn {
	width=100%
}

.burger-btn {
  display: none;
  background: none;
  border: 1px solid #ddd;
  border-radius: 6px;
  width: 36px; height: 36px;
  cursor: pointer;
  font-size: 18px;
}

.mobile-menu {
  display: none;
  flex-direction: column;
  position: absolute;
  top: 56px; left: 0; right: 0;
  background: #fff;
  border-bottom: 1px solid #eee;
  padding: 8px 0;
  z-index: 100;
}
.mobile-menu.open { display: flex; }
.mobile-menu a {
  padding: 12px 1.5rem;
  font-weight: 500;
  color: #A47DAB;
  text-decoration: none;
}
.mobile-menu a:hover { background: #f5f5f5; }

@media (max-width: 600px) {
  .nav-links { display: none; }
  .burger-btn { display: flex; align-items: center; justify-content: center; float: right; }
}

.body-container{
	margin-top: 210px !important;
	max-width:900px;
	margin:2rem auto;
	background:#fff;
	padding:2rem;
	border-radius:10px;
	box-shadow:0 10px 30px rgba(0,0,0,.08)}
.auteur {
  display: block;
  text-align: right;
  font-variant: small-caps;
  letter-spacing: 0.05em;
  color: #555;
}.tabs {
  max-width: 600px;
  margin: 40px auto;
  font-family: system-ui, sans-serif;
}

.tabs input {
  display: none;
}

/* Onglets */
.tab-labels {
  display: flex;
  gap: 8px;
  border-bottom: 2px solid #eee;
}

label {
  padding: 12px 20px;
  cursor: pointer;
  font-weight: 500;
  color: #666;
  border-radius: 8px 8px 0 0;
  transition: all 0.25s ease;
}

/* Onglet actif */
#tab1:checked ~ .tab-labels label[for="tab1"],
#tab2:checked ~ .tab-labels label[for="tab2"],
#tab3:checked ~ .tab-labels label[for="tab3"],
#tab4:checked ~ .tab-labels label[for="tab4"] {
  color: #000;
  background: #fff;
  box-shadow: 0 -2px 8px rgba(0,0,0,0.08);
}

/* Contenu */
.tab-content {
  background: #fff;
  border-radius: 0 8px 8px 8px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.08);
}

.content {
  display: none;
}

/* Affichage selon l’onglet */
#tab1:checked ~ .tab-content .content1,
#tab2:checked ~ .tab-content .content2,
#tab3:checked ~ .tab-content .content3,
#tab4:checked ~ .tab-content .content4,
#tab5:checked ~ .tab-content .content5 {
  display: block;
  padding: 24px;
}
footer {
	text-align:center;
	padding:1rem;
	font-family: system-ui, sans-serif;
	font-size:.9rem
}


  /* ── BRAND HEADER ── */
  .brand-header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .75rem;
    margin-bottom: 2rem;
  }
  .brand-header .line {
    flex: 1;
    height: 12px;
    background: var(--purple);
  }
  .brand-header .brand-title {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.7rem;
    font-weight: 300;
    letter-spacing: .08em;
    color: var(--ink);
    white-space: nowrap;
  }
  .brand-header .brand-sub {
    display: block;
    text-align: center;
    font-family: 'Jost', sans-serif;
    font-size: .65rem;
    font-weight: 500;
    letter-spacing: .25em;
    text-transform: uppercase;
    color: var(--muted);
    margin-top: .15rem;
  }
  .brand-block { text-align: center; }
  
	/* blockquote { */
	  /* font-family: "Playfair Display", serif; */
	  /* font-size: 2rem; */
	  /* line-height: 1.25; */
	  /* max-width: 800px; */
	  /* margin: 0px; */
	  /* margin-left: 40px */
	/* } */

  /* ── QUOTE ── */
  .quote-block {
    text-align: center;
    padding: 1.5rem 1rem;
    margin-bottom: 2rem;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
  }
  .quote-block blockquote {
    font-family: 'Cormorant Garamond', serif;
    font-style: italic;
    font-size: 2rem;
    line-height: 1.65;
    color: var(--ink-soft);
  }
  .quote-block cite {
    display: block;
    margin-top: .75rem;
    font-family: 'Jost', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: .78rem;
    letter-spacing: .1em;
    color: var(--purple);
  }

  /* ── CONTACT ── */
  .contact-block {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    margin-bottom: 2.5rem;
    font-size: .9rem;
    color: var(--ink-soft);
    letter-spacing: .05em;
  }
  .contact-block .phone-icon {
    font-size: 1rem;
    color: var(--purple);
  }

  /* ── SECTION TITLE ── */
  .section-title {
    font-family: 'Jost', sans-serif;
    font-size: .7rem;
    font-weight: 500;
    letter-spacing: .25em;
    text-transform: uppercase;
    color: var(--purple);
    margin-bottom: .4rem;
  }
  .section-heading {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.9rem;
    font-weight: 300;
    color: var(--ink);
    margin-bottom: .5rem;
  }
  .section-note {
    font-size: .82rem;
    color: var(--muted);
    line-height: 1.5;
    margin-bottom: .3rem;
  }
  
  .section-text {
    font-size: .82rem;
    color: var(--ink-soft);
    font-weight: 500;
  }
  
  .section-end {
    margin-bottom: 1.75rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid var(--sage);
  }

  /* ── OFFER CARDS ── */
  .offer-card {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    gap: 0 .75rem;
    background: var(--sage-light);
    border-left: 3px solid var(--sage);
    padding: .9rem 0 .9rem .9rem;
    margin-bottom: 1rem;
    border-radius: 0 2px 2px 0;
    overflow: hidden;
    transition: border-color .2s;
  }
  .offer-card:hover { border-color: var(--purple-light); }

  .offer-card .offer-info { grid-column: 1; grid-row: 1 / 3; }
  .offer-card .offer-img  { grid-column: 2; grid-row: 1 / 3; }

  .offer-badge {
    display: inline-block;
    font-family: 'Jost', sans-serif;
    font-size: .72rem;
    font-weight: 500;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ink);
    border-bottom: 1.5px solid var(--ink);
    margin-bottom: .35rem;
    padding-bottom: .1rem;
  }
  .offer-price {
    display: block;
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.4rem;
    font-weight: 400;
    color: var(--purple);
    margin-bottom: .3rem;
  }
  .offer-desc {
    font-size: .78rem;
    color: var(--ink-soft);
    line-height: 1.45;
  }
  .offer-img img {
    width: 100px;
    height: 100%;
    min-height: 90px;
    object-fit: cover;
    display: block;
  }