/* =====================================
   RESET
===================================== */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    overflow-x:hidden;

    background-color:#F7F4EE;	
    color:#2F2B29;

    font-family:var(--font-body);
    font-size:16px;
    line-height:1.7;
}

img{
    max-width:100%;
    display:block;
}

a{
    text-decoration:none;
    color:inherit;
}

ul{
    list-style:none;
}


/* =====================================
   VARIABLES
===================================== */

:root{

	--text-dark:#2F2B29;
    --text-muted:#6B6560;
	
    --cream:#F7F4EE;
    --sand:#ECE6D9;
    --taupe:#8E8477;
    --dark:#2F2B29;

    --font-display:"Violense", serif;
    --font-body:"Helvetica Neue", sans-serif;
    --font-editorial:"Bookmania", serif;

}


/* =====================================
   LAYOUT
===================================== */

.container{

    width:100%;

    margin:0 auto;

    padding:0 0px;
}

section{
    position:relative;
}

/* =====================================
   GLOBAL BACKGROUND SHAPE
===================================== */

.site-background-shape{

    position:fixed;

    top:0;
    left:0;

    width:100%;
    height:100vh;

    background-image:url('../images/background-shape.svg');

    background-repeat:no-repeat;

    background-position:top center;

    background-size:100% auto;

    pointer-events:none;

    z-index:-1;
}

/* =====================================
   TYPOGRAPHY
===================================== */

h1,
h2,
h3,
h4,
h5{
    font-weight:400;
}

.page-title,
.display-title{

    font-family:var(--font-display);

    font-weight:400;
    line-height:1.05;
}

.hero{

    position:relative;

    overflow:hidden;

    display:grid;

    grid-template-columns:50% 50%;

    min-height:auto;
	
	border-bottom:1px solid #DED8CC;
}

.hero-right img{

    width:100%;

    object-fit:cover;

    display:block;

}

.hero-left{

    padding:60px 40px 60px 40px;

    display:flex;

    flex-direction:column;

    justify-content:flex-start;
}

.hero-title{
	
	font-family:"Violense", sans-serif;
	
	max-width:580px;

    font-size:42px;
    font-weight:400;
    line-height:1.12;

    margin-bottom:30px;
}


.hero-title .v{
font-family:"Helvetica Neue", sans-serif;
}


.editorial,

.hero-meta{

    font-size:11px;

    text-transform:uppercase;

    letter-spacing:.24em;

    color:#8E8477;

    margin-bottom:34px;
}

.hero-quote{

    border-left:1px solid #D7D0C5;

    padding-left:22px;

    margin-bottom:auto;

    max-width:540px;
}

.hero-quote p{

    font-family:var(--font-editorial);

    font-style:italic;

    font-size:17px;

    line-height:1.75;

    color:#6B6560;
}

.hero-actions{

    display:flex;

    gap:20px;

    margin-top:auto;

}

.eyebrow{

    font-size:11px;

    text-transform:uppercase;
    letter-spacing:.2em;

    color:var(--taupe);
}


/* =====================================
   BUTTONS
===================================== */

.btn{

    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-width:205px;
    height:48px;
    padding:0 28px;
    font-size:12px;
    letter-spacing:.12em;
    text-transform:uppercase;
    transition:.3s ease;
}

.btn-dark{

    background:var(--dark);
    color:white;
}

.btn-dark:hover{
    opacity:.9;
}

.btn-light{

    border:1px solid #CFC7BA;
}

.btn-light:hover{

    background:var(--dark);
    color:white;
}

.btn-outline-light{

    border:1px solid rgba(255,255,255,.5);
    color:white;
}

.about-btn-dark{

    display:inline-flex;

    align-items:center;
    justify-content:center;

    width:180px;
    height:46px;

    background:#2F2B29;

    color:#fff;

    text-transform:uppercase;

    letter-spacing:.15em;

    font-size:11px;

    text-decoration:none;
}

.about-btn-light{

    display:inline-flex;

    align-items:center;
    justify-content:center;

    width:180px;
    height:46px;

    border:1px solid rgba(255,255,255,.45);

    color:#fff;

    text-transform:uppercase;

    letter-spacing:.15em;

    font-size:11px;

    text-decoration:none;
}

/* =====================================
   HEADER
===================================== */

.site-header{

    position:sticky;
    top:0;

    z-index:999;

    background:#FAF8F4;

    border-bottom:1px solid #C8C2B8;
}

.site-header .container{

    padding-left:60px;
    padding-right:60px;
}

.header-inner{

    height:72px;

    display:grid;
    grid-template-columns:300px 1fr 300px;

    align-items:center;

    padding-left:45px;
    padding-right:45px;
}

.logo{

    display:flex;
	 justify-self:start;
    align-items:center;
}

.logo img{

    height:22px;
    width:auto;

    display:block;
}

.main-nav{

    display:flex;

    gap:48px;
justify-self:center;
    margin-left:auto;
    margin-right:auto;
}

.main-nav a{

    font-size:11px;

    text-transform:uppercase;

    letter-spacing:.14em;

	color:var(--text-muted);

    transition:.25s ease;
}

.main-nav a:hover{

    color:#2F2B29;
}

.header-cart{

    font-size:16px;
}

/* =====================================
   PILLARS
===================================== */

.home-pillars{

    position:relative;

    margin-top:60px;
	margin-bottom:60px;
    padding-top:0px;
    padding-bottom:0px;
}

.home-pillars .container{

    max-width:1240px;

    margin:0 auto;

    padding:0 40px;
}

/* -------------------------------------
   GRID
------------------------------------- */

.pillars-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:32px;
}

/* -------------------------------------
   CARD
------------------------------------- */

.pillar-card1{

  display:flex;
    flex-direction:column;
    align-items:flex-start;
	margin-left:20px;
}
.pillar-card2{

  display:flex;
    flex-direction:column;
    align-items:flex-start;
	margin-left:10px;
	margin-right:10px;
}
.pillar-card3{

  display:flex;
    flex-direction:column;
    align-items:flex-start;
	margin-right:20px;
}

/* -------------------------------------
   EYEBROW
------------------------------------- */

.pillar-eyebrow{

    font-size:11px;

    text-transform:uppercase;

    letter-spacing:.24em;

    color:#9A9184;

    margin-bottom:20px;
}

/* -------------------------------------
   IMAGE
------------------------------------- */

.pillar-card1 img{

    width:100%;

    height:auto;

    display:block;

    margin-bottom:32px;
}

.pillar-card2 img{

    width:100%;

    height:auto;

    display:block;

    margin-bottom:32px;
}

.pillar-card3 img{

    width:100%;

    height:auto;

    display:block;

    margin-bottom:32px;
}

/* -------------------------------------
   TITLE
------------------------------------- */

.pillar-card1 h3{

    font-family:"Helvetica Neue", sans-serif;

    font-size:24px;

    line-height:1.15;

    font-weight:400;

    color:#302B28;

    margin-bottom:28px;

    min-height:56px;
}

.pillar-card2 h3{

    font-family:"Helvetica Neue", sans-serif;

    font-size:24px;

    line-height:1.15;

    font-weight:400;

    color:#302B28;

    margin-bottom:28px;

    min-height:56px;
}

.pillar-card3 h3{

    font-family:"Helvetica Neue", sans-serif;

    font-size:24px;

    line-height:1.15;

    font-weight:400;

    color:#302B28;

    margin-bottom:28px;

    min-height:56px;
}

/* -------------------------------------
   TEXT
------------------------------------- */

.pillar-card1 p{

    font-size:13px;

    line-height:1.65;

    color:#6B6560;

    margin-bottom:42px;

    flex-grow:1;
}

.pillar-card2 p{

    font-size:13px;

    line-height:1.65;

    color:#6B6560;

    margin-bottom:42px;

    flex-grow:1;
}

.pillar-card3 p{

    font-size:13px;

    line-height:1.65;

    color:#6B6560;

    margin-bottom:42px;

    flex-grow:1;
}

/* -------------------------------------
   BUTTON
------------------------------------- */

.pillar-btn{

    display:inline-flex;

    align-items:center;
    justify-content:center;

    width:320px;
    height:44px;

    flex:none;

    border:1px solid #BFB7AA;

    color:#8B8275;

    font-size:12px;

    letter-spacing:.14em;

    text-transform:uppercase;
}

.pillar-btn:hover{

    background:#2F2B29;

    color:#FFFFFF;

    border-color:#2F2B29;
}

/* =====================================
   LE SOUFFLE
===================================== */

.home-souffle{

    padding-top:60px;
	padding-bottom:0px;
    border-top:1px solid #DED8CC;
}

.home-souffle .container{

    padding-left:0px;
    padding-right:0px;
}

.souffle-eyebrow{

    font-size:11px;

    text-transform:uppercase;

    letter-spacing:.24em;

    color:#9A9184;

    margin-bottom:18px;
	
	margin-left:54px;
	
}

.souffle-title{

    font-family:"Helvetica Neue", sans-serif;

    font-size:36px;

    line-height:1.3;

    font-weight:400;

    color:#2F2B29;

    margin-bottom:34px;
	
	margin-left:54px;
}

.souffle-gallery{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    width:100%;

}

.souffle-gallery img{

    width:100%;

    object-fit:cover;

    display:block;
}

/* =====================================
   APPROCHE
===================================== */
.approche{

    display:grid;

    grid-template-columns:50% 50%;

    justify-content:center;

    align-items:start;

    border-top:1px solid #DED8CC;
 	border-bottom:1px solid #DED8CC;
    position:relative;
}

.approche::after{

    content:"";

    position:absolute;

    top:0;
    bottom:0;

    left:50%;

    width:1px;

    background:#DED8CC;

    transform:translateX(-50%);
}

.approche-left{

	padding:60px 40px 60px 40px;
}

.approche .eyebrow{

    font-size:11px;

    letter-spacing:.24em;

    text-transform:uppercase;

    color:#9A9184;

    margin-bottom:20px;
}

.approche h2{

    font-family:"Violense", sans-serif;

    font-size:42px;

    font-weight:400;

    line-height:1.15;

    color:#2F2B29;

    margin-bottom:34px;
}

.approche-left p:not(.eyebrow){

    max-width:420px;

    font-size:16px;

    line-height:2;

    color:#6B6560;

    margin-bottom:38px;
}

.approche-tags{

    display:flex;

    flex-wrap:wrap;

    gap:10px;
}

.approche-tags span{

    display:inline-flex;

    align-items:center;
    justify-content:center;

    height:34px;

    padding:0 18px;

    border:1px solid #D6D0C6;

    border-radius:999px;

    font-size:12px;

    color:#7D756B;
}


/* =====================================
   ATELIERS À VENIR
===================================== */

.upcoming-workshops{

    position:relative;

    overflow:hidden;

    padding:60px 40px 60px 40px;
    border-bottom:1px solid #DED8CC;
	border-top:1px solid #DED8CC;
}

.workshops-content{

    position:relative;

    z-index:2;

    margin:0 auto;

    padding:0 0px;
}

.upcoming-workshops h2{

    font-family:"Helvetica Neue", sans-serif;

    font-size:24px;

    font-weight:400;

    text-transform:uppercase;

    margin-bottom:18px;

    color:#2F2B29;
}

.upcoming-workshops h3{

    font-family:"Bookmania", serif;

    font-size:16px;

    font-weight:400;
	margin-left:60px;
    margin-bottom:18px;

    color:#2F2B29;
}

.upcoming-workshops p{

	font-family:"Helvetica Neue", sans-serif;

    font-size:11px;
	
    max-width:560px;
	margin-left:60px;

    line-height:1.9;

    color:#6B6560;

    margin-bottom:32px;
}

.workshop-btn{

    display:inline-flex;

    align-items:center;
    justify-content:center;

    width:140px;
    height:44px;
	margin-left:60px;
    border:1px solid #BFB7AA;

    color:#8B8275;

    font-size:11px;

    letter-spacing:.14em;

    text-transform:uppercase;

    transition:.25s ease;
}

.workshop-btn:hover{

    background:#2F2B29;

    color:#fff;

    border-color:#2F2B29;
}

/* =====================================
   CTA FINAL
===================================== */

.home-cta{

    background:#796D61;

	padding:60px 40px 60px 40px;

    text-align:center;
}

.home-cta-inner{

    margin:0 auto;
}

.cta-eyebrow{
	
	font-family:"Helvetica Neue", sans-serif;
    font-size:9px;

    letter-spacing:.24em;

    text-transform:uppercase;

    color:rgba(255,255,255,.65);

    margin-bottom:12px;
}

.home-cta h2{

    font-family:"Helvetica Neue", sans-serif;

    font-size:24px;

    font-weight:400;

    text-transform:uppercase;

    color:white;

    margin-bottom:18px;
}

.cta-text{

	font-family:"Helvetica Neue", sans-serif;
    font-size:14px;

    line-height:1.8;

    color:rgba(255,255,255,.85);

    margin:0 auto 28px;
}

.cta-buttons{

    display:flex;

    justify-content:center;

    gap:12px;
}

.cta-btn{

    display:inline-flex;

    align-items:center;
    justify-content:center;

    height:42px;

    padding:0 24px;

    font-size:11px;

    letter-spacing:.14em;

    text-transform:uppercase;

    transition:.25s ease;
}

.cta-btn-dark{

    background:#2F2B29;

    color:white;
}

.cta-btn-light{

    border:1px solid rgba(255,255,255,.45);

    color:white;
}

.cta-btn-light:hover{

    background:white;

    color:#2F2B29;
}

/* =====================================
   FOOTER
===================================== */

.site-footer{
    background:#FAF8F4;
    border-top:1px solid #C8C2B8;
    padding:60px 60px;
}

.footer-inner{

    max-width:1440px;

    margin:0 auto;

    display:grid;

    grid-template-columns:
    1.5fr
    1fr
    1fr;

    gap:120px;
}

.footer-logo img{
    height:22px;
    width:auto;
    display:block;
}

.footer-brand p{

	color:var(--text-muted);

    font-size:12px;
}

.footer-nav{

    display:flex;
    flex-direction:column;
    gap:14px;
}

.footer-nav a{

    color:var(--text-muted);

    font-size:12px;

    text-transform:uppercase;

    letter-spacing:.12em;
}

.footer-contact{

    display:flex;
    flex-direction:column;
    gap:14px;
	color:var(--text-muted);
}

.footer-contact a{

    color:var(--text-muted);

    transition:.25s ease;

    text-decoration:none;
}

.footer-nav a:hover,
.footer-contact a:hover{

    color:var(--text-dark);
}

.footer-contact h4{

    color:var(--text-muted);

    font-size:12px;

    letter-spacing:.18em;

    font-weight:400;
}

/* =====================================
   LE SOUFFLE - HERO
===================================== */

.project-hero{

    display:grid;

    grid-template-columns:1fr 1fr;

    border-top:1px solid #DED8CC;
    border-bottom:1px solid #DED8CC;
}

.project-hero-left,
.project-hero-right{

    padding:70px 60px;
}

.project-hero-right{

    border-left:1px solid #DED8CC;
}

.project-hero .eyebrow{

    font-size:11px;

    letter-spacing:.24em;

    text-transform:uppercase;

    color:#9A9184;

    margin-bottom:28px;
}

.project-hero h1{

    font-family:"Violense", serif;

    font-size:42px;

    font-weight:300;

    line-height:1;

    color:#2F2B29;

    margin:0;
}

.project-hero-right p{

    max-width:420px;

    font-size:18px;

    line-height:1.8;

    color:#6A625A;

    font-style:italic;
}

/* =====================================
   LE SOUFFLE - INTRO
===================================== */

.project-intro{

    display:grid;

    grid-template-columns:320px 1fr;

    border-bottom:1px solid #DED8CC;
}

.project-intro-left{

    padding:60px;

    border-right:1px solid #DED8CC;
}

.project-intro-left ul{

    list-style:none;

    margin:0;
    padding:0;
}

.project-intro-left li{

   font-family:"Helvetica Neue", sans-serif;

    font-size:28px;

    line-height:1.8;

    color:#4B443E;
}

.project-intro-right{

    padding:60px 70px;

    max-width:900px;
}

.project-intro-right p{

    font-size:18px;

    line-height:2;

    color:#5E5A56;

    margin-bottom:26px;
}

.project-intro-right p:last-child{

    margin-bottom:0;
}

/* =====================================
   CHAPITRE 01
===================================== */

.chapter-gallery-01{

    display:grid;

    grid-template-columns:1.15fr 1fr 1fr;

    gap:24px;

    margin:60px 0;
}

.chapter-gallery-01 img{

    width:100%;

    object-fit:cover;

    display:block;
}

/* grande image gauche */

.pt-1{

    grid-row:span 2;

    height:640px;
}

/* haut droite */

.pt-2{

    height:300px;
}

.pt-3{

    height:300px;
}

/* bas */

.pt-4{

    height:260px;
}

.pt-5{

    height:260px;
}

/* =====================================
   CHAPITRE 02
===================================== */

.chapter-gallery-02{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:24px;

    margin:70px 0;
}

.chapter-gallery-02 img{

    width:100%;

    object-fit:cover;

    display:block;
}

/* ligne 1 */

.inv-1{
    height:340px;
}

.inv-2{
    height:520px;
}

.inv-3{
    height:300px;
}

/* ligne 2 */

.inv-4{
    height:240px;
}

.inv-5{
    height:340px;
}

.inv-6{
    height:460px;
}

/* ligne 3 */

.inv-7{
    height:300px;
}

.inv-8{
    height:220px;
}

.inv-9{
    height:360px;
}

/* =====================================
   CHAPITRE 03
===================================== */

.chapter-gallery-03{

    display:grid;

    grid-template-columns:1.2fr 1fr 1fr;

    gap:24px;

    margin:70px 0;
}

.chapter-gallery-03 img{

    width:100%;

    object-fit:cover;

    display:block;
}

/* colonne dominante */

.mem-1{

    grid-row:span 2;

    height:700px;
}

/* haut */

.mem-2{
    height:330px;
}

.mem-3{
    height:330px;
}

/* milieu */

.mem-4{
    height:250px;
}

.mem-5{
    height:250px;
}

/* bas */

.mem-6{
    height:320px;
}

.mem-7{
    height:320px;
}

/* =====================================
   CHAPITRE 04 - VIDEO
===================================== */

.project-video{

    margin:140px 0;
}

.video-player{

    margin:60px 0 30px;
}

.video-player video{

    width:100%;

    display:block;
}

.video-gallery{

    display:grid;

    grid-template-columns:repeat(5,1fr);

    gap:20px;

    margin-bottom:50px;
}

.video-gallery img{

    width:100%;

    height:180px;

    object-fit:cover;

    display:block;
}

/* =====================================
   ABOUT
===================================== */

.about-hero{
    display:grid;
    grid-template-columns:1fr 1fr;
    border-bottom:1px solid #DED8CC;
}

.about-hero-left{
    padding:95px 40px 80px 40px;

    display:flex;

    flex-direction:column;

    justify-content:flex-start;
	background:white;
}

.about-hero-left h1{
    max-width:600px;

    font-size:42px;
    line-height:1.05;
    font-weight:400;

    color:#2F2B29;

    margin-bottom:50px;
}

.about-hero-left .hero-intro{

    border-left:1px solid #D7D0C5;

    padding-left:22px;

    margin-bottom:auto;

    max-width:540px;
	
	font-family:var(--font-editorial);

    font-style:italic;

    font-size:17px;

    line-height:1.75;

    color:#6B6560;
	
}

.about-hero-right{
    overflow:hidden;
}

.about-hero-right img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.about-statement{

    display:grid;

    grid-template-columns:30% 70%;

    padding:70px;

    background:#F2ECDD;

    border-bottom:1px solid #DED8CC;
}

.statement-label{

    font-size:11px;

    letter-spacing:.22em;

    text-transform:uppercase;

    color:#8E8578;
}

.statement-text p{

    max-width:920px;

   font-family:"Bookmania", sans-serif;

    font-size:20px;

    line-height:1.55;

    color:#3A3531;

    margin:0;
} 

.about-bio{

    display:grid;

    grid-template-columns:30% 70%;

    border-top:1px solid #DED8CC;
}

.about-sidebar{

    padding:60px;

    border-right:1px solid #DED8CC;
}

.about-text{

    padding:60px 70px;

}

.about-text p{

    font-size:15px;

    line-height:2;

    color:#5E5A56;

    margin-bottom:34px;
}

.sidebar-block{

    margin-bottom:20px;
}

.sidebar-block h3{

    font-size:12px;

    letter-spacing:.22em;

    text-transform:uppercase;

    color:#8E8578;

    margin-bottom:10px;
}

.sidebar-block ul{

    list-style:none;

    padding:0;

    margin:0;
}

.sidebar-block li{

    padding:8px 0;

    border-bottom:1px solid #E5DFD5;

    font-size:14px;
}

.sidebar-block p{

    font-size:14px;

    line-height:2;
    padding:8px 0;
    margin:0;
	
	border-bottom:1px solid #DED8CC;
}

.about-values{

    background:#8D7F72;

    color:#F5F1E8;

    padding:40px 60px 0;

    border-bottom:1px solid rgba(255,255,255,.12);
}

.values-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    margin-top:0;
}

.values-label{

    display:block;

    margin-bottom:28px;

    font-size:11px;

    letter-spacing:.24em;

    text-transform:uppercase;

    color:#F5F1E8;
}

.values-divider{

    width:100%;

    height:1px;

    background:rgba(255,255,255,.20);

    margin-bottom:0;
}

.value-card{

    padding:70px 45px;

    border-right:1px solid rgba(255,255,255,.12);
}

.value-card:last-child{

    border-right:none;
}

.value-card h3{

    font-family:"Bookmania", sans-serif;

    font-size:34px;

    font-weight:400;

    line-height:1.2;

    margin-bottom:20px;

    color:#F7F2E8;
}

.value-card p{

    font-size:15px;

    line-height:1.9;

    color:rgba(255,255,255,.85);
}

.about-parcours{

    display:grid;

    grid-template-columns:52% 48%;

    border-bottom:1px solid #DED8CC;
}

.parcours-left{

    padding:70px;

    background:#FAF8F4;
}

.parcours-left .eyebrow{

    font-size:11px;

    letter-spacing:.22em;

    text-transform:uppercase;

    color:#8E8578;

    margin-bottom:40px;
}

.timeline-item{

    display:grid;

    grid-template-columns:110px 1fr;

    gap:30px;

    padding:35px 0;

    border-bottom:1px solid #E3DDD2;
}

.timeline-item:last-child{

    border-bottom:1px solid #E3DDD2;
}

.timeline-item span{

    font-size:11px;

    color:#8E8578;
}

.timeline-item h4{

   font-family:"Helvetica Neue", sans-serif;

    font-size:17px;

    font-weight:400;

    color:#2F2B29;

    margin-bottom:10px;
}

.timeline-item p{

    font-size:12px;

    line-height:1.8;

    color:#66605A;
}

.parcours-right{

    min-height:900px;
}

.parcours-right img{

    object-fit:fill;

    display:block;
}

.about-banner{

    height:360px;

    overflow:hidden;
}

.about-banner img{

    width:100%;

    height:100%;

    object-fit:cover;

    display:block;
}

.about-cta{

    display:grid;

    grid-template-columns:58% 42%;
}

.about-cta-left{

    background:#F2ECDD;

    padding:90px 70px;
}

.about-cta-right{

    background:#8D7F72;

    padding:90px 70px;
}

.about-cta .eyebrow{

    font-size:11px;

    letter-spacing:.22em;

    text-transform:uppercase;

    margin-bottom:22px;
}

.about-cta-left .eyebrow{

    color:#8E8578;
	font-size:9px;
}

.about-cta-right .eyebrow{

    color:rgba(255,255,255,.7);
	font-size:9px;
}

.about-cta h2{

    font-family:"Helvetica Neue", sans-serif;

    font-size:52px;

    font-weight:400;

    line-height:1.15;

    margin-bottom:25px;
}

.about-cta-left h2{

    color:#2F2B29;
	font-size:26px;
}

.about-cta-right h2{

    color:white;
	font-size:26px;
}

.about-cta p{

    max-width:500px;

    font-size:13px;

    line-height:1.9;

    margin-bottom:35px;
}

.about-cta-left p{

    color:#5F5852;
}

.about-cta-right p{

    color:rgba(255,255,255,.85);
}

/* =====================================
   FORMATION HERO
===================================== */

.formation-hero{

    display:grid;

    grid-template-columns:1fr 1fr;

    border-top:1px solid #DED8CC;

    border-bottom:1px solid #DED8CC;
}

.formation-hero__content{

    display:flex;

    flex-direction:column;
	
    justify-content:flex-start;

    padding:70px 80px 60px;

}

.formation-hero__content .s{

	font-family:"Helvetica Neue", sans-serif;
	
}

.formation-hero__image img{

    width:100%;

    object-fit:cover;

    display:block;
}

.formation-hero .eyebrow{

    font-size:9px;

    letter-spacing:.24em;

    text-transform:uppercase;

    color:#9A9184;

    margin-bottom:22px;
}

.formation-hero h1{

    font-family:"Violense", serif;

    font-size:42px;

    line-height:0.95;

    font-weight:400;

    color:#2F2B29;

    margin-bottom:34px;
}

.formation-hero .intro{

    border-left:1px solid #D7D0C5;

    padding-left:22px;

    margin-bottom:auto;

    max-width:540px;
	
	font-family:var(--font-editorial);

    font-style:italic;

    font-size:17px;

    line-height:1.75;

    color:#6B6560;
}

.hero-buttons{

    display:flex;

    gap:14px;
}

/* =====================================
   FORMATION SERVICES
===================================== */

.formation-services{

    display:grid;

    grid-template-columns:1fr 1fr;

    border-bottom:1px solid #DED8CC;
}

.formation-service-card{

    padding:55px 60px 60px;
}

.formation-service-card:first-child{

    border-right:1px solid #DED8CC;
}

.formation-service-card .eyebrow{

    font-size:11px;

    letter-spacing:.24em;

    text-transform:uppercase;

    color:#9A9184;

    margin-bottom:22px;
}

.formation-service-card h2{

    font-family:"Helvetica Neue", sans-serif;

    font-size:28px;

    line-height:1.15;

    font-weight:400;

    color:#2F2B29;

    margin-bottom:22px;

    max-width:420px;
}

.formation-service-card p{

    font-size:14px;

    line-height:1.75;

    color:#6B6560;

    max-width:520px;

    margin-bottom:14px;
}

/* =====================================
   FORMATION AUDIENCE
===================================== */

.formation-audience{

    background:#85786B;

    padding:55px 70px 65px;

    color:#F5F1EA;
}

.formation-audience .eyebrow{

    font-size:9px;

    letter-spacing:.24em;

    text-transform:uppercase;

    opacity:.75;

    margin-bottom:18px;
	
	color:#EEE7D6;
}

.formation-audience h2{

    font-family:"Helvetica Neue", sans-serif;

    font-size:28px;

    font-weight:400;

    margin-bottom:32px;
}

.audience-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:22px;
}

.audience-card{

    background:#F5F1EA;

    padding:24px;

    min-height:130px;
}

.audience-card h3{

    font-family:"Helvetica Neue", sans-serif;

    font-size:17px;

    color:#4C433B;

    margin-bottom:12px;
}

.audience-card p{

    font-size:11px;

    line-height:1.8;

    color:#6B6560;
}

.formation-audience__inner{

    max-width:1640px;

    margin:0 auto;
}

/* =====================================
   FORMATION OFFERS
===================================== */

.formation-offers{

    display:grid;

    grid-template-columns:repeat(3,1fr);

	border-top:1px solid #DED8CC;
	
    border-bottom:1px solid #DED8CC;
}

.offer-card{

    display:flex;

    flex-direction:column;

    min-height:680px;

    border-right:1px solid #DED8CC;
}

.offer-card:last-child{

    border-right:none;
}

.offer-card > *{

    padding-left:40px;
    padding-right:40px;
}

.offer-number{

    display:block;

    padding-top:30px;

    font-size:11px;

    color:#A39A8D;

    letter-spacing:.2em;
}

.offer-card h3{

    margin-top:18px;

    margin-bottom:26px;

    font-family:"Helvetica Neue", sans-serif;

    font-size:32px;

    line-height:1.2;

    font-weight:400;

    color:#21506A;
}

.offer-card p{

    color:#6B6560;

    line-height:1.9;
	
	font-size:14px;
}

.offer-section{

    margin-top:40px;

    flex-grow:1;
}

.offer-label{

    font-size:9px;

    letter-spacing:.24em;

    text-transform:uppercase;

    color:#A39A8D;

    margin-bottom:18px;
}

.offer-section ul{

    list-style:none;

    padding:0;

    margin:0;
	
	font-size:12px;
}

.offer-section p{

    list-style:none;

    padding:0;

    margin:0;
	
	font-size:9px;
}

.offer-section li{

    padding:12px 0;

    border-bottom:1px solid #E7E1D7;

    color:#6B6560;
}

.offer-footer{

    background:#F3EEDF;
    padding:24px 40px;
}

.offer-footer p{

    background:#F3EEDF;
	font-size:9px;
}

.offer-footer .s{

	font-family:"Helvetica Neue", sans-serif;
    background:#F3EEDF;
	font-size:18px;
	color:#21506A;
}

.offer-footer .t{

	font-family:"Helvetica Neue", sans-serif;
	font-size:11px;
    background:#F3EEDF;
	color:#9A9490;
}

.offer-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    height:42px;

    padding:0 24px;

    margin-top:18px;

    background:#2F2B29;

    color:#FFF;

    text-decoration:none;

    font-size:11px;

    letter-spacing:.15em;

    text-transform:uppercase;
}

/* =====================================
   MÉTHODE
===================================== */

.formation-method{

    display:grid;

    grid-template-columns:34% 66%;

    border-top:1px solid #DED8CC;
    border-bottom:1px solid #DED8CC;
}

.method-left{

    padding:70px 40px 60px;

    border-right:1px solid #DED8CC;
}

.method-right{

    padding:70px 55px 60px;
}

.method-right p{

    max-width:760px;

    font-size:14px;

    line-height:2;

    color:#6B6560;

    margin-bottom:24px;
}

.method-left h3,
.method-right h3{

    font-size:22px;

    line-height:1.15;

    margin-bottom:38px;
}

.formation-method .eyebrow{

    font-size:9px;

    letter-spacing:.24em;

    text-transform:uppercase;

    color:#9A9184;

    margin-bottom:20px;
}

.formation-method h3{

    font-family:"Helvetica Neue", sans-serif;

    font-size:24px;

    font-weight:400;

    color:#2F2B29;

    margin-bottom:30px;
}

.engagement-list{

    border-top:1px solid #DED8CC;
}

.engagement-item{

    display:flex;

    gap:14px;

    padding:24px 0;

    border-bottom:1px solid #DED8CC;
}

.engagement-item .icon{

    width:16px;

    flex-shrink:0;

    font-size:12px;

    color:#2F2B29;

    margin-top:4px;
}

.engagement-item strong{

    display:block;

    font-size:13px;

    font-weight:500;

    color:#2F2B29;

    margin-bottom:8px;
}

.engagement-item p{

    font-size:13px;

    line-height:1.6;

    color:#6B6560;
}



/* =====================================
   CTA FINAL
===================================== */

.formation-cta{

    display:grid;

    grid-template-columns:65% 35%;

    border-top:1px solid #DED8CC;
}

.formation-cta-left{

    padding:70px 70px 80px;
    background:#E8E2D3;
    color:black;
	
}

.formation-cta-right{

    padding:70px 70px 80px;
	background:#1F5878;
    color:white;
	
}


.formation-cta-right .eyebrow{

    color:white;
}
.formation-cta-right p,
.formation-cta-right h3{

    color:white;
}

.formation-cta-left{

    border-right:1px solid rgba(0,0,0,.08);
}

.formation-cta .eyebrow{

    font-size:9px;
	
	color:#796D61;
	
    text-transform:uppercase;

    letter-spacing:.24em;

    margin-bottom:22px;

    opacity:.7;
}

.formation-cta h3{

    font-family:"Helvetica Neue", sans-serif;

    font-size:26px;

    font-weight:400;

    line-height:1.15;

    margin-bottom:24px;
}

.formation-cta p{

    max-width:420px;

    font-size:13px;

    line-height:1.9;

    margin-bottom:34px;
}

.cta-project-btn{

    display:inline-flex;

    align-items:center;
    justify-content:center;

    width:130px;
    height:42px;

    background:#2F2B29;

    color:#FFFFFF;

    text-decoration:none;

    font-size:11px;

    font-weight:400;

    letter-spacing:.14em;

    text-transform:uppercase;

    transition:.25s ease;
}

.cta-project-btn:hover{

    background:#1E1B19;
}

.cta-photo-btn{

    display:inline-flex;

    align-items:center;
    justify-content:center;

    width:145px;
    height:42px;

    border:1px solid rgba(255,255,255,.6);

    color:#FFFFFF;

    text-decoration:none;

    font-size:11px;

    font-weight:400;

    letter-spacing:.14em;

    text-transform:uppercase;

    transition:.25s ease;
}

.cta-photo-btn:hover{

    background:rgba(255,255,255,.08);

    border-color:#FFFFFF;
}
/* =====================================
   CONTACT
===================================== */

.contact-page{

    display:grid;

    grid-template-columns:1fr 1fr;

    border-top:1px solid #DED8CC;
}

.contact-left{

    background:#F0EBDD;

    padding:70px 64px 80px;
}

.contact-right{

    background:#FAF8F4;

    padding:60px 40px 60px 40px;

    border-left:1px solid #DED8CC;
	
}

/* =====================================
   CONTACT FORM
===================================== */

.contact-right .wpcf7-form{

    margin-top:20px;
}

.contact-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:16px;

    margin-bottom:16px;
}

.field-full{

    margin-bottom:16px;
}

.field-half label,
.field-full label{

    display:block;

    margin-bottom:7px;

    font-size:11px;

    text-transform:uppercase;

    letter-spacing:.18em;

    color:#9A9184;
}

.contact-right input{

    width:100%;

    border:none;

    border-bottom:1px solid #D8D2C8;

    background:transparent;

    padding:0 0 14px;

    font-size:16px;

    color:#2F2B29;

    height:42px;
}

.contact-right textarea{

    width:100%;

    border:none;

    border-bottom:1px solid #D8D2C8;

    background:#FFFFFF;

    padding:10px;

    font-size:16px;

    color:#2F2B29;

    min-height:40px;

    resize:none;
}

.contact-right input::placeholder,
.contact-right textarea::placeholder{

    color:#9A9184;
}

.contact-form-footer{

    display:flex;

    justify-content:flex-start;

    align-items:flex-end;

    gap:40px;

    margin-top:18px;
}

.contact-legal{

    font-size:13px;

    line-height:1.8;

    color:#8A837B;
}
.contact-right .wpcf7-submit{

    width:116px;
    height:44px;

    background:#2F2B29;

    border:none;

    color:#FFF;

    font-size:12px;

    letter-spacing:.14em;

    text-transform:uppercase;

    cursor:pointer;

    transition:.25s ease;
	
}

.contact-form-footer p:last-child{

    margin-left:auto;
}

.contact-right .wpcf7-submit:hover{

    opacity:.9;
}

.contact-eyebrow{

    font-size:11px;

    letter-spacing:.24em;

    text-transform:uppercase;

    color:#9A9184;

    margin-bottom:28px;
}

.contact-title{

	font-family:"Violense", sans-serif;
	
    font-size:42px;

    line-height:1.05;

	max-width:420px;
	
    font-weight:400;

    margin-bottom:48px;
}

.contact-title .s{

	font-family:"Helvetica Neue", sans-serif;
	
    font-size:42px;

    line-height:1.05;

	max-width:420px;
	
    font-weight:400;

    margin-bottom:48px;
}

.contact-title .t{

	font-family:"Helvetica Neue", sans-serif;
	
	font-style:italic;
	
    font-size:46px;

    line-height:1.05;

	max-width:420px;
	
    font-weight:400;

    margin-bottom:48px;
}

.contact-intro{

    font-family:"Bookmania", serif;

    font-style:italic;

    font-size:18px;

    line-height:1.9;
	
	max-width:520px;

    color:#6B6560;
}

.contact-intro p{

    margin-bottom:8px;
}

.contact-infos{

    margin-top:70px;
}

.contact-row{

    display:grid;

    grid-template-columns:120px 1fr;

    align-items:center;

    padding:24px 0;

    border-top:1px solid #D8D2C8;
}

.contact-row:last-child{

    border-bottom:1px solid #D8D2C8;
}

.contact-row span{

    font-size:10px;

    text-transform:uppercase;

    letter-spacing:.20em;

    color:#9A9184;
}

.contact-row p{

    font-size:16px;

    line-height:1.6;

    color:#2F2B29;

    margin:0;
}

/* =====================================
   ACCOMPAGNEMENT HERO
===================================== */

.accompagnement-hero{

    display:grid;

    grid-template-columns:60% 40%;

    border-top:1px solid #DED8CC;
    border-bottom:1px solid #DED8CC;
}

.accompagnement-hero-left{

    padding:64px;

    display:flex;

    flex-direction:column;

    justify-content:center;
}

.accompagnement-hero-left h1{

    font-family:"Violense", sans-serif;

    font-size:72px;

    line-height:.9;

    font-weight:400;

    margin:24px 0 40px;
}

.accompagnement-hero-right{

    display:flex;

    align-items:center;

    padding:64px;

}

.accompagnement-hero-right{

    display:flex;

    align-items:center;

    justify-content:center;
    
}

.accompagnement-hero-right blockquote{

    font-family:var(--font-editorial);

	border-left:1px solid #DED8CC;
	
	padding:32px;
	
    font-style:italic;

    font-size:17px;

    line-height:1.75;

    color:#6B6560
}

.accompagnement-hero h1{

    font-family:"Violense", serif;

    font-size:42px;

    line-height:.95;

    font-weight:400;

    color:#2F2B29;

    margin:30px 0;
}

.accompagnement-hero p{

    max-width:520px;

    font-size:18px;

    line-height:2;

    color:#6B6560;
}

/* =====================================
   SERVICES
===================================== */

.accompagnement-services{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    border-top:1px solid #DED8CC;

    border-bottom:1px solid #DED8CC;
}

.service-card{

    display:flex;

    flex-direction:column;

    padding:34px;

    border-right:1px solid #DED8CC;

    min-height:100%;
}

.service-card:last-child{

    border-right:none;
}

/* =====================================
   IMAGE
===================================== */

.service-card img{

    width:100%;

    display:block;

    margin-bottom:26px;
}

/* =====================================
   TITRE
===================================== */

.service-card h3{

    font-family:"Violense", serif;

    font-size:20px;

    line-height:1.15;

    font-weight:400;

    color:#2F2B29;

    margin-bottom:24px;

    min-height:72px;
}

/* =====================================
   TEXTE
===================================== */

.service-card p{

    font-size:15px;

    line-height:1.85;

    color:#6B6560;

    margin-bottom:28px;
}

/* =====================================
   META
===================================== */

.service-meta{

    margin-top:auto;

    margin-bottom:24px;
}

.service-meta-label{

    display:block;

    margin-bottom:12px;

    font-size:10px;

    text-transform:uppercase;

    letter-spacing:.18em;

    color:#9A9184;
}

/* =====================================
   TAGS
===================================== */

.service-tags{

    display:flex;

    flex-wrap:wrap;

    gap:8px;
}

.service-tags span{

    display:inline-flex;

    align-items:center;

    height:24px;

    padding:0 10px;

    border:1px solid #A99C8A;

    border-radius:999px;

    font-size:11px;

    color:#6B6560;
}

/* =====================================
   BOUTON
===================================== */

.service-card .btn-outline{

    width:100%;

    height:42px;

    display:flex;

    align-items:center;

    justify-content:center;

    border:1px solid #BFB7AA;

    font-size:12px;

    letter-spacing:.14em;

    text-transform:uppercase;

    color:#8B8275;

    margin-top:0;
}
/* =====================================
   APPROCHE
===================================== */

.accompagnement-approche{

    display:grid;

    grid-template-columns:50% 50%;

    border-top:1px solid #DED8CC;
    border-bottom:1px solid #DED8CC;
}

.accompagnement-approche h2{

    font-family:"Helvetica Neue", sans-serif;

    font-size:30px;

    line-height:1.15;

    font-weight:400;

    margin:25px 0;
}

.approche-left p{

    max-width:500px;
	font-size:13px;
    line-height:2;
}

.approche-right{

    border-left:1px solid #DED8CC;
	display:block;

    margin:auto;
}

.approche-list{

    width:100%;

   
}

.approche-item{

    display:flex;

    align-items:flex-start;

    gap:16px;

    padding:22px 0;

    border-bottom:1px solid #DED8CC;
}

.approche-item .icon{

    width:22px;

    height:22px;

    min-width:22px;

    flex-shrink:0;

    display:block;

    margin-top:2px;
	margin-left:10px;
	margin-bottom:2px;
	margin-right:2px;
}

.approche-item strong{

    display:block;

    margin-bottom:8px;

    font-family:"Helvetica Neue", sans-serif;

    font-size:18px;

    font-weight:400;

    color:#2F2B29;
}

.approche-item p{

    margin:0;

    font-size:14px;

    line-height:1.8;

    color:#6B6560;
}


/* =====================================
   BANNIERE
===================================== */

.accompagnement-banner{

    height:520px;
}

.accompagnement-banner img{

    width:100%;

    height:100%;

    object-fit:cover;

    display:block;
}

/* =====================================
   CONTEXTES
===================================== */

.accompagnement-contextes{

    display:grid;

    grid-template-columns:50% 50%;

    border-top:1px solid #DED8CC;
    border-bottom:1px solid #DED8CC;
}

/* -------------------------------------
   COLONNES
------------------------------------- */

.contextes-left,
.contextes-right{

    padding:60px;
}

.contextes-right{

    border-left:1px solid #DED8CC;
}

/* -------------------------------------
   TITRES
------------------------------------- */

.contextes-left h2{

    font-family:"Bookmania", serif;

    font-size:30px;

    font-weight:400;

    line-height:1.2;

    color:#2F2B29;

    margin:18px 0 36px;
}

.contextes-right h2{

    font-family:"Bookmania", serif;

    font-size:28px;

    font-weight:400;

    line-height:1.3;

    color:#2F2B29;

    margin:18px 0 36px;

    max-width:620px;
}

/* -------------------------------------
   LISTE CONTEXTES
------------------------------------- */

.contextes-list{

    margin-top:20px;
}

.contexte-item{

    display:grid;

    grid-template-columns:32px 1fr;

    gap:20px;

    padding:22px 0;

    border-top:1px solid #DED8CC;
}

.contexte-item:last-child{

    border-bottom:1px solid #DED8CC;
}

.contexte-number{

    font-size:10px;

    letter-spacing:.12em;

    color:#C5BEB2;

    padding-top:5px;
}

.contexte-content h3{

    font-family:"Bookmania", serif;

    font-size:18px;

    font-weight:400;

    line-height:1.4;

    color:#2F2B29;

    margin:0 0 8px;
}

.contexte-content p{

    margin:0;

    font-size:14px;

    line-height:1.8;

    color:#7A736B;

    max-width:520px;
}

/* -------------------------------------
   ETHIQUE
------------------------------------- */

.contextes-right p{

    font-size:16px;

    line-height:2;

    color:black;

    margin:0 0 24px;

    max-width:640px;
}


.contextes-right p2{

    font-family:"Bookmania", serif;
	color:#9A9184;
	
	font-size:16px;

    line-height:2;

    margin-bottom:24px;

    max-width:640px;
}

.contextes-right p em{

    font-family:"Bookmania", serif;

    font-style:italic;

    color:#7A736B;
}

/* -------------------------------------
   LABEL
------------------------------------- */

.contextes-left .section-label,
.contextes-right .section-label{

    display:block;

    font-size:11px;

    letter-spacing:.24em;

    text-transform:uppercase;

}

/* =====================================
   CTA
===================================== */

.accompagnement-cta{

    background:#8D7F72;

    text-align:center;

    padding:110px 40px;
}

.accompagnement-cta .section-label{

    color:rgba(255,255,255,.7);
}

.accompagnement-cta h2{

    font-family:"Helvetica Neue", sans-serif;

    font-size:64px;

    color:white;

    font-weight:400;

    margin:25px 0;
}

.accompagnement-cta p{

    max-width:700px;

    margin:0 auto 40px;

    color:rgba(255,255,255,.9);

    line-height:2;
}


/* =====================================
   TEMOIGNAGES
===================================== */

.accompagnement-testimonials{

    padding:90px 60px;

    border-top:1px solid #DED8CC;
    border-bottom:1px solid #DED8CC;
}

.accompagnement-testimonials h2{

    font-family:"Bookmania", serif;

    font-size:30px;

    font-weight:400;

    line-height:1.2;

    color:#2F2B29;

    margin:16px 0 50px;
}

/* -------------------------------------
   GRID
------------------------------------- */

.testimonials-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:14px;
}

/* -------------------------------------
   CARD
------------------------------------- */

.testimonial-card{

    border:1px solid #DED8CC;

    padding:34px 30px;

    min-height:340px;

    display:flex;

    flex-direction:column;

    justify-content:space-between;

    background:#F5F1E6;
}

/* -------------------------------------
   QUOTE
------------------------------------- */

.testimonial-quote{

    margin:0;

    font-family:"Bookmania", serif;

    font-style:italic;

    font-size:18px;

    line-height:1.8;

    color:#3E3935;
}

/* -------------------------------------
   AUTHOR
------------------------------------- */

.testimonial-author{

    margin-top:30px;

    font-size:13px;

    line-height:1.6;

    color:#8C857B;
}
/* =====================================
   LABELS
===================================== */

.section-label{

    font-size:11px;

    text-transform:uppercase;

    letter-spacing:.24em;

    color:#9A9184;
}

/* ==================================================
   SERVICES PAGES
================================================== */

.service-page{

    position:relative;

}

.service-page section{

    position:relative;
}

/* =================================
   HERO
================================= */

.service-hero{

    display:grid;

    grid-template-columns:50% 50%;

    border-bottom:1px solid #DED8CC;
}

.service-hero-left{

    padding:90px 70px;

    display:flex;

    flex-direction:column;

    justify-content:center;
}

.service-hero-right img{

    width:100%;

    object-fit:cover;

    display:block;
}

.service-hero h1{

    font-family:"Violense", serif;

    font-size:42px;

    line-height:0.95;

    font-weight:400;

    margin:30px 0;
}

.service-hero blockquote{

    font-family:"Helvetica Neue", sans-serif;

    font-size:24px;

    line-height:1.8;

    color:#6B6560;

    margin-bottom:40px;

    max-width:500px;
}


/* =================================
   INTRO
================================= */

.service-intro{

    display:grid;

    grid-template-columns:40% 60%;

    border-bottom:1px solid #DED8CC;
}

.service-intro-left{

    padding:80px 70px;

    border-right:1px solid #DED8CC;
}

.service-intro-right{

    padding:80px 70px;
}

.service-intro h2{

    font-family:"Bookmania", serif;

    font-size:22px;

    line-height:1.2;

    font-weight:400;

    margin:25px 0 40px;
}

.service-intro ul{

    list-style:none;

    padding:0;

    margin:0;
}

.service-intro li{

    padding:13px 0;

    border-bottom:1px solid #DED8CC;
}

.service-intro-right p{

    line-height:2;

    color:#5E5854;
margin-bottom:24px;
	margin-top:24px;
  
}

.service-intro-right p2{

    line-height:2;
	font-family:'Bookmania', sans-serif;
    color:#6B6560;

    margin-bottom:24px;
}

/* =================================
   CARTES
================================= */

.service-cards,
.service-formats,
.service-outils,
.service-langages,
.service-principes{

    display:grid;

    gap:24px;

    padding:90px 70px;
	
	grid-template-columns:repeat(4,1fr);
}

.service-cards{

    grid-template-columns:repeat(3,1fr);
}

.service-formats{

    grid-template-columns:repeat(3,1fr);
}

.service-outils{

    grid-template-columns:repeat(4,1fr);
}

.service-langages{

    grid-template-columns:repeat(7,1fr);
}

.format-card,
.outil-card,
.langage-card,
.principe-card{

    background:#FDFBF7;

    border:1px solid #DED8CC;

    padding:35px;
}

/* =================================
   REFERENCES
================================= */

.service-references,
.service-accompagnement{

    display:grid;

    grid-template-columns:50% 50%;

    border-top:1px solid #DED8CC;
    border-bottom:1px solid #DED8CC;
}

.references-left,
.accompagnement-left{

    padding:90px 70px;

    border-right:1px solid #DED8CC;
}

.references-right,
.accompagnement-right{

    padding:90px 70px;
}

.reference-item{

    padding:22px 0;

    border-bottom:1px solid #DED8CC;
}

/* =================================
   BANNERS
================================= */

.service-banner img{

    width:100%;

    height:420px;

    object-fit:cover;

    display:block;
}

.service-banners{

    display:grid;

    grid-template-columns:50% 50%;
}

.service-banners img{

    width:100%;

    height:320px;

    object-fit:cover;

    display:block;
}

/* =================================
   CTA FINAL
================================= */

.service-cta{

    display:grid;

    grid-template-columns:65% 35%;
}

.service-cta-left{

    padding:80px 70px;

    background:#F3EEDF;
}

.service-cta-right{

    padding:80px 70px;

    color:white;
}

.service-cta h2{

    font-family:"Helvetica Neue", sans-serif;

    font-size:48px;

    font-weight:400;

    margin-bottom:20px;
}

/* =====================================
   FORMATS
===================================== */

.photo-formats{

    background:#8D8073;

    padding:90px 80px;

    color:#F7F2E8;
}

.photo-formats .section-label{

    color:rgba(255,255,255,.6);

    margin-bottom:20px;

    display:block;
}

.photo-formats h2{

    font-family:"Bookmania", serif;

    font-size:42px;

    font-weight:400;

    margin-bottom:50px;

    color:#F7F2E8;
}

.formats-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:24px;
}

.format-card{

    background:#F4EFE3;

    padding:32px;

    min-height:250px;
}

.format-card h3{

    font-family:"Bookmania", serif;

    font-size:28px;

    font-weight:400;

    color:#C77C54;

    margin-bottom:20px;
}

.format-card p{

    color:#6B6560;

    line-height:1.8;

    margin-bottom:30px;
}

.format-meta{

    display:block;

    padding-top:18px;

    border-top:1px solid #DDD4C6;

    font-size:12px;

    color:#9A9184;
}

/* =====================================
   REFERENCES
===================================== */

.photo-references{

    display:grid;

    grid-template-columns:50% 50%;

    border-top:1px solid #DED8CC;
}

.references-left,
.references-right{

    padding:80px;
}

.references-right{

    border-left:1px solid #DED8CC;
}

.references-left h2{

    font-family:"Bookmania", serif;

    font-size:48px;

    font-weight:400;

    line-height:1.2;

    margin:20px 0 40px;
}

.references-left p{

    color:#6B6560;

    line-height:2;

    margin-bottom:24px;

    max-width:620px;
}

.references-right ul{

    list-style:none;

    margin:20px 0 0;

    padding:0;
}

.references-right li{

    padding:24px 0;

    border-top:1px solid #DED8CC;
}

.references-right strong{

    display:block;

    font-family:"Bookmania", serif;

    font-size:24px;

    font-style:italic;

    font-weight:400;

    margin-bottom:10px;

    color:#4B443E;
}

.references-right p{

    margin:0;

    color:#6B6560;

    line-height:1.8;
}

/* =====================================
   CTA FINAL
===================================== */

.service-next{

    display:grid;

    grid-template-columns:60% 40%;

    border-top:1px solid #DED8CC;
}

.service-next-left,
.service-next-right{

    padding:80px;
}

.service-next-right{

    background:#C9784F;

    color:#FFF;
}

.service-next-left h2,
.service-next-right h2{

    font-family:"Bookmania", serif;

    font-size:42px;

    font-weight:400;

    margin:20px 0;
}

.service-next-left p{

    max-width:520px;

    line-height:1.9;

    color:#6B6560;

    margin-bottom:30px;
}

.service-next-right p{

    max-width:420px;

    line-height:1.9;

    color:rgba(255,255,255,.85);

    margin-bottom:30px;
}

.service-next-right .section-label{

    color:rgba(255,255,255,.6);
}

.btn-outline-light{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    width:220px;

    height:48px;

    border:1px solid rgba(255,255,255,.4);

    color:#FFF;

    text-transform:uppercase;

    letter-spacing:.14em;

    font-size:12px;
}

/* =====================================
   OUTILS
===================================== */

.art-outils{

    background:#86796D;

    padding:90px 80px;

    color:#F7F2E8;
}

.art-outils .section-label{

    display:block;

    color:rgba(255,255,255,.55);

    margin-bottom:20px;
}

.art-outils h2{

    font-family:"Bookmania", serif;

    font-size:42px;

    font-weight:400;

    margin-bottom:50px;

    color:#F7F2E8;
}

.outils-grid{

    display:grid;

    grid-template-columns:repeat(7,1fr);

    gap:4px;
}

.outil-card{

    background:#F5F0E4;

    min-height:210px;

    padding:24px;
}

.outil-card span{

    display:block;

    font-size:11px;

    letter-spacing:.18em;

    color:#A59B8D;

    margin-bottom:20px;
}

.outil-card h3{

    font-family:"Bookmania", serif;

    font-size:24px;

    font-weight:400;

    color:#4B443E;

    margin-bottom:16px;
}

.outil-card p{

    font-size:14px;

    line-height:1.8;

    color:#6B6560;
}

/* =====================================
   BENEFICES
===================================== */

.art-benefices{

    display:grid;

    grid-template-columns:50% 50%;

    border-top:1px solid #DED8CC;
}

.benefices-left,
.benefices-right{

    padding:90px 80px;
}

.benefices-right{

    border-left:1px solid #DED8CC;
}

.benefices-left h2,
.benefices-right h2{

    font-family:"Bookmania", serif;

    font-size:44px;

    line-height:1.3;

    font-weight:400;

    margin:20px 0 40px;
}

.benefices-left ul,
.benefices-right ul{

    list-style:none;

    padding:0;

    margin:0;
}

.benefices-left li,
.benefices-right li{

    position:relative;

    padding-left:18px;

    margin-bottom:20px;

    line-height:1.9;

    color:#6B6560;
}

.benefices-left li::before,
.benefices-right li::before{

    content:"•";

    position:absolute;

    left:0;

    color:#C77C54;
}

/* =====================================
   BANNIERE
===================================== */

.service-banner{

    height:320px;

    overflow:hidden;
}

.service-banner img{

    width:100%;

    height:100%;

    object-fit:cover;

    display:block;
}

/* =====================================
   ART THERAPIE FORMATS
===================================== */

.art-formats{

    background:#A3AA90;

    padding:90px 80px;
}

.art-formats .section-label{

    display:block;

    margin-bottom:18px;
}

.art-formats h2{

    font-family:"Bookmania", serif;

    font-size:42px;

    font-weight:400;

    color:#2F2B29;

    margin-bottom:50px;
}

.art-formats-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:24px;
}

.art-format-card{

    background:#F8F5EE;

    padding:32px;

    min-height:420px;

    display:flex;

    flex-direction:column;
}

.art-format-type{

    font-size:10px;

    letter-spacing:.22em;

    text-transform:uppercase;

    color:#9A9184;

    margin-bottom:24px;
}

.art-format-card h3{

    font-family:"Bookmania", serif;

    font-size:28px;

    font-weight:400;

    color:#2F2B29;

    margin-bottom:20px;
}

.art-format-card p{

    line-height:1.9;

    color:#6B6560;

    margin-bottom:30px;

    flex-grow:1;
}

.art-format-price{

    display:block;

    font-family:"Bookmania", serif;

    font-size:34px;

    font-weight:400;

    color:#2F2B29;

    margin-bottom:12px;
}

.art-format-meta{

    display:block;

    font-size:12px;

    color:#9A9184;

    margin-bottom:28px;
}

.art-format-btn{

    display:flex;

    align-items:center;

    justify-content:center;

    width:100%;

    height:48px;

    border:1px solid #BFB7AA;

    color:#8B8275;

    text-transform:uppercase;

    letter-spacing:.14em;

    font-size:11px;

    text-decoration:none;

    transition:.25s ease;
}

.art-format-btn:hover{

    background:#2F2B29;

    color:#FFF;

    border-color:#2F2B29;
}

/* =====================================
   ECO HERO
===================================== */

.eco-hero{

    display:grid;

    grid-template-columns:50% 50%;

    border-top:1px solid #DED8CC;
    border-bottom:1px solid #DED8CC;
}

.eco-hero-left{

    padding:80px;

    display:flex;

    flex-direction:column;

    justify-content:center;
}

.eco-hero-left h1{

    font-family:"Violense", serif;

    font-size:68px;

    line-height:.92;

    font-weight:400;

    margin-bottom:40px;
}

.eco-hero-left blockquote{

    font-family:"Bookmania", serif;

    font-style:italic;

    font-size:20px;

    line-height:1.8;

    color:#6B6560;

    margin-bottom:40px;
}

.eco-hero-buttons{

    display:flex;

    gap:16px;
}

.eco-hero-right img{

    width:100%;

    height:100%;

    object-fit:cover;

    display:block;
}

/* =====================================
   ECO INTRO
===================================== */

.eco-intro{

    display:grid;

    grid-template-columns:40% 60%;
}

.eco-intro-left{

    padding:70px;

    border-right:1px solid #DED8CC;
}

.eco-intro-right{

    padding:70px;
}

.eco-intro-left h2{

    font-size:44px;

    line-height:1.2;

    font-weight:400;

    margin:20px 0 30px;
}

.eco-note{

    background:#F7F5EF;

    border-left:2px solid #77835C;

    padding:18px;

    font-family:"Bookmania", serif;

    font-style:italic;

    margin-bottom:40px;
}

.eco-intro-left img{

    width:100%;

    display:block;

    margin-top:40px;
}

.eco-intro-right p{

    line-height:2;

    color:#5F5A55;

    margin-bottom:22px;
}

/* =====================================
   ECO OUTILS
===================================== */

.eco-outils{

    background:#8F8377;

    padding:80px 60px 90px;
}

.eco-outils h2{

    color:#F7F3EA;

    margin:35px 0 60px;
}

.eco-outils-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:6px;
}

.eco-outil-card{

    background:#F4F0E7;

    padding:34px 32px 36px;

    min-height:270px;
}

.eco-number{

    display:block;

    font-size:11px;

    letter-spacing:.15em;

    color:#9E927F;

    margin-bottom:40px;
}

.eco-outil-card h3{

    font-size:18px;

    line-height:1.35;

    font-weight:400;

    margin-bottom:28px;
}

.eco-outil-card p{

    font-size:14px;

    line-height:2;

    color:#6B6560;

    margin:0;
}

.eco-number{

    display:block;

    margin-bottom:25px;

    font-size:11px;

    letter-spacing:.18em;

    color:#9A9184;
}


/* =====================================
   ECO BANNER
===================================== */

.eco-banner img{

    width:100%;

    height:420px;

    object-fit:cover;

    display:block;
}

/* =====================================
   ECO APPROCHE
===================================== */

.eco-approche{

    padding:70px 60px;

    border-bottom:1px solid #DED8CC;
}

.eco-approche-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    margin-top:50px;
}

.eco-approche-card{

    padding:40px;

    border-right:1px solid #DED8CC;
}

.eco-approche-card:last-child{

    border-right:none;
}

.eco-approche-card img{

    width:56px;

    margin-bottom:30px;
}

.eco-approche-card h3{

    font-size:28px;

    font-weight:400;

    margin-bottom:18px;
}

.eco-approche-card p{

    line-height:1.8;

    color:#6B6560;
}

/* =====================================
   ECO FORMATS
===================================== */

.eco-formats{

    background:#A2AA8B;

    padding:70px 60px 90px;
}

.eco-formats h2{

    color:#F5F1E8;

    font-size:44px;

    font-weight:400;

    margin:18px 0 50px;
}

.eco-formats-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:24px;
}

.eco-format-card{

    background:#F8F5EF;

    padding:34px;
}

.eco-format-type{

    display:block;

    margin-bottom:22px;

    font-size:10px;

    letter-spacing:.18em;

    color:#9A9184;
}

.eco-format-card h3{

    font-size:28px;

    font-weight:400;

    margin-bottom:18px;
}

.eco-price{

    display:block;

    margin-top:25px;

    margin-bottom:10px;

    font-size:34px;

    font-weight:400;
}

.eco-meta{

    display:block;

    margin-bottom:30px;

    font-size:13px;

    color:#8C857D;
}

.eco-btn{

    display:block;

    text-align:center;

    border:1px solid #BEB6AA;

    padding:14px;

    text-decoration:none;

    color:#2F2B29;

    font-size:12px;

    letter-spacing:.15em;
}

/* =====================================
   SOUFFLE HERO
===================================== */

.souffle-hero{

    display:grid;

    grid-template-columns:50% 50%;

    border-top:1px solid #DED8CC;
    border-bottom:1px solid #DED8CC;
}

.souffle-hero-left{

    padding:80px;
}

.souffle-hero-right{

    padding:80px;

    border-left:1px solid #DED8CC;

    display:flex;

    align-items:center;
}

.souffle-hero h1{

    font-family:"Violense", serif;

    font-size:68px;

    font-weight:400;

    margin-top:20px;
}

.souffle-hero blockquote{

    font-family:"Bookmania", serif;

    font-style:italic;

    font-size:22px;

    line-height:1.8;

    color:#6B6560;

    max-width:520px;

    margin:0;
}

/* =====================================
   SOUFFLE INTRO
===================================== */

.souffle-intro{

    display:grid;

    grid-template-columns:34% 66%;

    border-bottom:1px solid #DED8CC;
}

.souffle-intro-left{

    padding:70px 50px 60px;

    border-right:1px solid #DED8CC;
}

.souffle-intro-left .section-label{

    display:block;

    margin-bottom:30px;
}

.souffle-intro-left ul{

    list-style:none;

    padding:0;

    margin:0;
}

.souffle-intro-left li{

    font-family:"Helvetica Neue", sans-serif;

    font-size:24px;

    font-weight:400;

    line-height:1.2;

    color:#2F2B29;

    padding:14px 0;

    border-bottom:1px solid #DED8CC;
}

.souffle-intro-left li:last-child{

    border-bottom:none;
}

.souffle-intro-left .italic{

    font-family:"Bookmania", serif;

    font-style:italic;

    color:#6B6560;
}

.souffle-status{

    display:block;

    margin-top:40px;

    font-size:10px;

    letter-spacing:.18em;

    text-transform:uppercase;

    color:#B5ADA2;
}

.souffle-intro-right{

    padding:70px 60px;
}

.souffle-intro-right p{
    font-family:"Helvetica Neue", sans-serif;
    max-width:720px;

    font-size:18px;

    line-height:2;

    color:#302B28;

    margin-bottom:24px;
}

.souffle-intro-right p2{

	font-family:"Bookmania", sans-serif;
    font-size:18px;
line-height:2;
    color:#6B6560;
margin-bottom:24px;
}

.souffle-intro-right p:last-child{

    margin-bottom:0;
}

.souffle-intro-right em{

    font-family:"Bookmania", serif;

    font-style:italic;

    color:#6B6560;
}

/* =====================================
   SOUFFLE CHAPITRE
===================================== */

.souffle-chapitre{

    border-top:1px solid #DED8CC;

    border-bottom:1px solid #DED8CC;

    background:#FAF8F4;
}

/* BANDEAU */

.souffle-chapitre__bandeau{

    height:46px;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#EFEADB;

    border-bottom:1px solid #DED8CC;
}

.souffle-chapitre__numero{

    font-size:10px;

    letter-spacing:.25em;

    text-transform:uppercase;

    color:#B5ADA2;
}

/* CONTENU */

.souffle-chapitre__conteneur{

    padding:60px;
}

/* HEADER */

.souffle-chapitre__entete{

    display:flex;

    justify-content:space-between;

    align-items:flex-start;

    margin-bottom:50px;
}

.souffle-chapitre__titre{

}

.souffle-chapitre__eyebrow{

    display:block;

    margin-bottom:16px;

    font-size:10px;

    letter-spacing:.25em;

    text-transform:uppercase;

    color:#B5ADA2;
}

.souffle-chapitre__titre h2{

    margin:0;

    font-size:42px;

    line-height:1.1;

    font-weight:400;

    color:#2F2B29;
}

.souffle-chapitre__infos{

    max-width:460px;

    text-align:right;
}

.souffle-chapitre__annee{

    display:block;

    margin-bottom:12px;

    font-size:10px;

    letter-spacing:.2em;

    text-transform:uppercase;

    color:#B5ADA2;
}

.souffle-chapitre__infos p{

    margin:0;

    font-size:14px;

    line-height:1.8;

    color:#6B6560;
}

/* IMAGE */

.souffle-chapitre__visuel{

    margin-bottom:50px;
}

.souffle-chapitre__visuel img{

    width:100%;

    display:block;
}

/* TEXTE BAS */

.souffle-chapitre__footer{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:80px;

    padding-top:40px;

    border-top:1px solid #DED8CC;
}

.souffle-chapitre__legende{

    display:block;

    margin-bottom:18px;

    font-size:10px;

    letter-spacing:.22em;

    text-transform:uppercase;

    color:#B5ADA2;
}

.souffle-chapitre__footer p{

    margin:0 0 18px;

    line-height:2;

    color:#6B6560;
}

/* VIDEO */

.souffle-video{

    margin-bottom:40px;
}

.souffle-video video{

    width:100%;

    display:block;
}

/* GALERIE */

.souffle-gallery2{

    display:grid;

    grid-template-columns:repeat(5,1fr);

    gap:20px;

    margin-bottom:50px;
}

.souffle-gallery2 img{

    width:auto;

    height:auto;

    max-width:none;

    display:block;
}

/* =====================================
   TABLET
===================================== */

@media (max-width:1024px){

    .container{

        padding-left:32px;

        padding-right:32px;
    }

    /* HERO SPLIT */

    .service-hero,
    .formation-hero,
    .accompagnement-hero,
    .contact-page,
    .accompagnement-approche,
    .accompagnement-contextes{

        grid-template-columns:1fr;
    }

    .service-hero-right,
    .formation-hero__image,
    .accompagnement-hero-right,
    .contact-right,
    .approche-right,
    .contextes-right{

        border-left:none;

        border-top:1px solid #DED8CC;
    }

    /* SERVICES */

    .accompagnement-services{

        grid-template-columns:1fr 1fr;

        gap:32px;

        padding:80px 40px;
    }

    /* TESTIMONIALS */

    .testimonials-grid{

        grid-template-columns:1fr 1fr;
    }

    /* FORMATS */

    .photo-formats-grid,
    .art-formats-grid,
    .nature-formats-grid{

        grid-template-columns:1fr;
    }

    /* FOOTER */

    .footer-inner{

        grid-template-columns:1fr;

        gap:40px;
    }

    /* CHAPITRES SOUFFLE */

    .souffle-chapitre__entete{

        flex-direction:column;

        gap:24px;
    }

    .souffle-chapitre__infos{

        text-align:left;

        max-width:none;
    }

    .souffle-chapitre__footer{

        grid-template-columns:1fr;
    }

    .souffle-gallery{

        grid-template-columns:repeat(3,1fr);
    }
}

/* =====================================
   MOBILE
===================================== */

@media (max-width:768px){

    body{

        overflow-x:hidden;
    }

    .container{

        padding-left:20px;

        padding-right:20px;
    }

    section{

        overflow:hidden;
    }

    /* TITRES */

    h1{

        font-size:42px !important;

        line-height:1.05 !important;
    }

    h2{

        font-size:34px !important;

        line-height:1.15 !important;
    }

    h3{

        font-size:24px !important;
    }

    /* HERO */

    .service-hero-left,
    .accompagnement-hero-left,
    .contact-left,
    .contact-right,
    .formation-hero__content{

        padding:40px 24px;
    }

    .service-hero blockquote{

        font-size:18px;
    }

    /* IMAGES */

    img{

        max-width:100%;

        height:auto;
    }

    /* SERVICES */

    .accompagnement-services{

        grid-template-columns:1fr;

        padding:60px 24px;
    }

    /* CONTEXTES */

    .contextes-item{

        grid-template-columns:1fr;

        gap:10px;
    }

    /* APPROCHE */

    .approche-right{

        padding:40px 24px;
    }

    .approche-right li{

        gap:16px;
    }

    /* FORMULAIRES */

    .contact-grid{

        grid-template-columns:1fr;
    }

    .contact-form-footer{

        flex-direction:column;

        align-items:flex-start;
    }

    /* TEMOIGNAGES */

    .testimonials-grid{

        grid-template-columns:1fr;
    }

    .testimonial-card{

        min-height:auto;
    }

    /* CHAPITRES */

    .souffle-chapitre__conteneur{

        padding:30px 20px;
    }

    .souffle-chapitre__titre h2{

        font-size:32px !important;
    }

    .souffle-gallery{

        grid-template-columns:1fr 1fr;
    }

    /* VIDEO */

    .souffle-video video{

        width:100%;
    }

    /* FOOTER */

    footer{

        text-align:center;
    }

    footer nav{

        justify-content:center;
    }
}

/* =====================================
   MOBILE
===================================== */

@media (max-width:768px){

    body{

        overflow-x:hidden;
    }

    .container{

        padding-left:20px;

        padding-right:20px;
    }

    section{

        overflow:hidden;
    }

    /* TITRES */

    h1{

        font-size:42px !important;

        line-height:1.05 !important;
    }

    h2{

        font-size:34px !important;

        line-height:1.15 !important;
    }

    h3{

        font-size:24px !important;
    }

    /* HERO */

    .service-hero-left,
    .accompagnement-hero-left,
    .contact-left,
    .contact-right,
    .formation-hero__content{

        padding:40px 24px;
    }

    .service-hero blockquote{

        font-size:18px;
    }

    /* IMAGES */

    img{

        max-width:100%;

        height:auto;
    }

    /* SERVICES */

    .accompagnement-services{

        grid-template-columns:1fr;

        padding:60px 24px;
    }

    /* CONTEXTES */

    .contextes-item{

        grid-template-columns:1fr;

        gap:10px;
    }

    /* APPROCHE */

    .approche-right{

        padding:40px 24px;
    }

    .approche-right li{

        gap:16px;
    }

    /* FORMULAIRES */

    .contact-grid{

        grid-template-columns:1fr;
    }

    .contact-form-footer{

        flex-direction:column;

        align-items:flex-start;
    }

    /* TEMOIGNAGES */

    .testimonials-grid{

        grid-template-columns:1fr;
    }

    .testimonial-card{

        min-height:auto;
    }

    /* CHAPITRES */

    .souffle-chapitre__conteneur{

        padding:30px 20px;
    }

    .souffle-chapitre__titre h2{

        font-size:32px !important;
    }

    .souffle-gallery{

        grid-template-columns:1fr 1fr;
    }

    /* VIDEO */

    .souffle-video video{

        width:100%;
    }

    /* FOOTER */

    footer{

        text-align:center;
    }

    footer nav{

        justify-content:center;
    }
}


/* =====================================
   SMALL MOBILE
===================================== */

@media (max-width:480px){

    h1{

        font-size:34px !important;
    }

    h2{

        font-size:28px !important;
    }

    .section-label{

        font-size:9px;

        letter-spacing:.18em;
    }

    .btn-primary,
    .btn-secondary,
    .btn-outline{

        width:100%;

        text-align:center;
    }

    .hero-buttons{

        display:flex;

        flex-direction:column;

        gap:12px;
    }

    .souffle-gallery{

        grid-template-columns:1fr;
    }

    .contact-row{

        grid-template-columns:1fr;

        gap:10px;
    }

    .contact-row span{

        margin-bottom:4px;
    }
}

*,
*::before,
*::after{

    box-sizing:border-box;
}

img,
video{

    max-width:100%;

    height:auto;

    display:block;
}

/* ===================================== RESPONSIVE MENU ===================================== */

@media (max-width:768px){

    .site-header .container{

        padding-left:20px;
        padding-right:20px;
    }

    .header-inner{

        display:flex;

        justify-content:space-between;

        align-items:center;

        height:72px;

        padding:0;
    }

    .logo img{

        height:18px;
    }

    .main-nav{

        display:none;
    }

}

.mobile-toggle{

    display:none;

    background:none;

	color:#000;
	
    border:none;

    font-size:24px;

    cursor:pointer;
}

@media (max-width:768px){

    .main-nav{
        display:none;
    }

    .mobile-toggle{
        display:block;
    }
}

@media (max-width:768px){

    .main-nav{

        display:none;

        position:absolute;

        top:72px;

        left:0;

        width:100%;

        background:#FAF8F4;

        flex-direction:column;

        gap:0;

        border-top:1px solid #DED8CC;
    }

    .main-nav.active{

        display:flex;
    }

    .main-nav li{

        width:100%;

        border-bottom:1px solid #DED8CC;
    }

    .main-nav a{

        display:block;

        padding:18px 24px;
    }

    .mobile-toggle{

        display:block;
    }
}

/* ===================================== RESPONSIVE HERO ===================================== */

@media (max-width:768px){

    .hero{

        display:flex;

        flex-direction:column;

    }

    .hero-right{

        order:-1;
    }

    .hero-right img{

        width:100%;

        height:auto;

        display:block;
    }

    .hero-left{

        padding:32px 24px 40px;
    }

    .hero-meta{

        font-size:10px;

        letter-spacing:.18em;

        margin-bottom:24px;
    }



    .hero-actions{

        display:flex;

        flex-direction:column;

        gap:12px;
    }

    .hero-actions a{

        width:100%;

        text-align:center;
    }
}

/* ===================================== RESPONSIVE TEST ===================================== */

@media (max-width:768px){

    .pillars-grid{

        display:grid;

        grid-template-columns:1fr !important;

        gap:40px;
    }

    .pillar-card1,
    .pillar-card2,
    .pillar-card3{

        width:100%;

        max-width:none;
    }

    .pillar-card1 img,
    .pillar-card2 img,
    .pillar-card3 img{

        width:100%;

        height:auto;
    }

    .pillar-card1 h3,
    .pillar-card2 h3,
    .pillar-card3 h3{

        font-size:32px !important;

        line-height:1.1;
    }

    .pillar-btn{

        width:100%;

        text-align:center;
    }

}

@media (max-width:768px){

    .approche{

        grid-template-columns:1fr !important;
    }

    .approche::after{

        content:none;
    }

    .approche-right{

        border-top:1px solid #DED8CC;
    }

}

/* ===================================== RESPONSIVE LE SOUFFLE ===================================== */

@media (max-width:768px){

    .souffle-intro{

        display:flex;

        flex-direction:column;
    }

    .souffle-intro-left{

        width:100%;

        border-right:none;

        border-bottom:1px solid #DED8CC;

        padding:30px 24px;
    }

    .souffle-intro-right{

        width:100%;

        padding:30px 24px;
    }

    .souffle-intro-right p{

        max-width:none;

        font-size:18px;

        line-height:1.8;
    }

}
/* =====================================
   ATELIERS A VENIR - MOBILE
===================================== */

@media (max-width:768px){

    .upcoming-workshops{

        padding:60px 24px;
    }

    .workshops-content{

        max-width:100%;

        text-align:left;
    }

    .workshops-content h2{

        font-size:14px !important;

        letter-spacing:.18em;
    }

    .workshops-content h3{

        font-size:28px !important;

        line-height:1.2;

        margin:12px 0 20px;
    }

    .workshops-content p{

        font-size:15px;

        line-height:1.8;
    }

    .workshop-btn{

        display:block;

        width:100%;

        text-align:center;

        margin-top:24px;
    }

}
/* =====================================
   PHOTO THERAPEUTIQUE - MOBILE
===================================== */

@media (max-width:768px){

    /* INTRO */

    .service-intro{

        display:grid;

        grid-template-columns:1fr !important;
    }

    .service-intro-left{

        padding:40px 24px;

        border-right:none;

        border-bottom:1px solid #DED8CC;
    }

    .service-intro-right{

        padding:40px 24px;
    }

    .service-intro-right p,
    .service-intro-right p2{

        display:block;

        font-size:15px !important;

        line-height:1.8;
    }

    /* FORMATS */

    .formats-grid{

        display:grid;

        grid-template-columns:1fr !important;

        gap:24px;
    }

    .format-card{

        width:100%;
    }

    /* REFERENCES */

    .photo-references{

        display:grid;

        grid-template-columns:1fr !important;
    }

    .references-left{

        padding:40px 24px;

        border-right:none;

        border-bottom:1px solid #DED8CC;
    }

    .references-right{

        padding:40px 24px;
    }

    .references-right ul{

        padding:0;

        margin:0;
    }

    .references-right li{

        padding:18px 0;
    }

    /* SECTION SUIVANTE */

    .service-next{

        display:grid;

        grid-template-columns:1fr !important;
    }

    .service-next-left{

        padding:40px 24px;

        border-right:none;

        border-bottom:1px solid rgba(0,0,0,.08);
    }

    .service-next-right{

        padding:40px 24px;
    }

    /* BOUTONS */

    .workshop-btn,
    .btn-outline-light{

        width:100%;

        text-align:center;

        display:block;
    }

}

/* =====================================
   ART THERAPIE - MOBILE
===================================== */

@media (max-width:768px){

    /* INTRO */

    .service-intro{

        display:grid;

        grid-template-columns:1fr;

    }

    .service-intro-left{

        border-right:none;

        border-bottom:1px solid #DED8CC;

        padding:40px 24px;
    }

    .service-intro-right{

        padding:40px 24px;
    }

    .service-intro-left h2{

        font-size:30px !important;

        line-height:1.2;
    }

    .service-intro-left img{

        width:100%;

        height:auto;

        margin-top:24px;
    }

    .service-intro-right p,
    .service-intro-right p2{

        font-size:15px !important;

        line-height:1.9;
    }


    /* OUTILS */

    .art-outils{

        padding:60px 24px;
    }

    .outils-grid{

        display:grid;

        grid-template-columns:1fr;

        gap:1px;
    }

    .outil-card{

        padding:28px 24px;
    }

    .outil-card h3{

        font-size:24px !important;
    }


    /* BENEFICES */

    .art-benefices{

        display:grid;

        grid-template-columns:1fr;
    }

    .benefices-left{

        border-right:none;

        border-bottom:1px solid #DED8CC;

        padding:40px 24px;
    }

    .benefices-right{

        padding:40px 24px;
    }

    .benefices-left h2,
    .benefices-right h2{

        font-size:30px !important;

        line-height:1.2;
    }

    .benefices-left ul,
    .benefices-right ul{

        padding-left:18px;
    }

    .benefices-left li,
    .benefices-right li{

        font-size:14px !important;

        line-height:1.8;
    }


    /* BANNIERE */

    .service-banner img{

        width:100%;

        height:260px;

        object-fit:cover;
    }


    /* FORMATS */

    .art-formats{

        padding:60px 24px;
    }

    .art-formats-grid{

        display:grid;

        grid-template-columns:1fr;

        gap:24px;
    }

    .art-format-card{

        padding:28px 24px;
    }

    .art-format-btn{

        width:100%;

        text-align:center;
    }


    /* CTA */

    .service-next{

        display:grid;

        grid-template-columns:1fr;
    }

    .service-next-left{

        border-right:none;

        border-bottom:1px solid rgba(255,255,255,.1);

        padding:40px 24px;
    }

    .service-next-right{

        padding:40px 24px;
    }

    .service-next-left h2,
    .service-next-right h2{

        font-size:28px !important;
    }

    .service-next .workshop-btn,
    .service-next .btn-outline-light{

        width:100%;

        text-align:center;
    }

}

/* =====================================
   ARTS EXPRESSIFS - MOBILE
===================================== */

@media (max-width:768px){

    /* INTRO */

    .service-intro{

        display:grid;

        grid-template-columns:1fr;
    }

    .service-intro-left{

        border-right:none;

        border-bottom:1px solid #DED8CC;

        padding:40px 24px;
    }

    .service-intro-right{

        padding:40px 24px;
    }

    .service-intro-left img{

        width:100%;

        height:auto;

        margin-top:24px;
    }

    .service-intro-left h2{

        font-size:30px !important;

        line-height:1.2;
    }

    /* OUTILS */

    .eco-outils{

        padding:60px 24px;
    }

    .eco-outils-grid{

        display:grid;

        grid-template-columns:1fr;

        gap:1px;
    }

    .eco-outil-card{

        padding:28px 24px;
    }

    .eco-outil-card h3{

        font-size:24px !important;
    }

    /* BANNIERE */

    .eco-banner img{

        width:100%;

        height:260px;

        object-fit:cover;
    }

    /* APPROCHE ECOSOMATIQUE */

    .eco-approche{

        padding:60px 24px;
    }

    .eco-approche-grid{

        display:grid;

        grid-template-columns:1fr;

        gap:0;
    }

    .eco-approche-card{

        padding:32px 0;

        border-right:none;

        border-bottom:1px solid #DED8CC;
    }

    .eco-approche-card:last-child{

        border-bottom:none;
    }

    .eco-approche-card img{

        width:54px;

        height:54px;

        margin-bottom:20px;
    }

    .eco-approche-card h3{

        font-size:26px !important;

        margin-bottom:16px;
    }

    /* FORMATS */

    .art-formats{

        padding:60px 24px;
    }

    .art-formats-grid{

        grid-template-columns:1fr;

        gap:24px;
    }

    .art-format-card{

        padding:28px 24px;
    }

    .art-format-btn{

        width:100%;

        text-align:center;
    }

    /* CTA */

    .service-next{

        display:grid;

        grid-template-columns:1fr;
    }

    .service-next-left{

        border-right:none;

        border-bottom:1px solid rgba(255,255,255,.1);

        padding:40px 24px;
    }

    .service-next-right{

        padding:40px 24px;
    }

    .service-next .workshop-btn,
    .service-next .btn-outline-light{

        width:100%;

        text-align:center;
    }
}

/* =====================================
   ABOUT PAGE - MOBILE
===================================== */

@media (max-width:768px){

    /* HERO */

    .about-hero{

        display:grid;

        grid-template-columns:1fr;
    }

    .about-hero-left{

        padding:40px 24px;
    }

    .about-hero-right{

        border-left:none;

        border-top:1px solid #DED8CC;
    }

    .about-hero-right img{

        width:100%;

        height:auto;

        display:block;
    }

    /* STATEMENT */

    .about-statement{

        display:grid;

        grid-template-columns:1fr;

        gap:20px;

        padding:40px 24px;
    }

    .statement-text p{

        font-size:20px;

        line-height:1.6;
    }

    /* BIO */

    .about-bio{

        display:grid;

        grid-template-columns:1fr;
    }

    .about-sidebar{

        border-right:none;

        border-bottom:1px solid #DED8CC;

        padding:40px 24px;
    }

    .about-text{

        padding:40px 24px;
    }

    /* VALEURS */

    .values-grid{

        display:grid;

        grid-template-columns:1fr;

        gap:0;
    }

    .value-card{

        padding:32px 24px;

        border-right:none;

        border-bottom:1px solid #DED8CC;
    }

    .value-card:last-child{

        border-bottom:none;
    }

    /* PARCOURS */

    .about-parcours{

        display:grid;

        grid-template-columns:1fr;
    }

    .parcours-left{

        padding:40px 24px;
    }

    .parcours-right{

        border-left:none;

        border-top:1px solid #DED8CC;
    }

    .parcours-right img{

        width:100%;

        height:auto;

        display:block;
    }

    .timeline-item{

        display:grid;

        grid-template-columns:1fr;

        gap:12px;
    }

    .timeline-item span{

        font-size:12px;
    }

    /* BANNIERE */

    .about-banner img{

        width:100%;

        height:280px;

        object-fit:cover;
    }

    /* CTA */

    .about-cta{

        display:grid;

        grid-template-columns:1fr;
    }

    .about-cta-left{

        border-right:none;

        border-bottom:1px solid rgba(255,255,255,.1);

        padding:40px 24px;
    }

    .about-cta-right{

        padding:40px 24px;
    }

    .about-btn-dark,
    .about-btn-light{

        display:block;

        width:100%;

        text-align:center;
    }

}

/* =====================================
   FORMATION - MOBILE
===================================== */

@media (max-width:768px){

    /* HERO */

    .formation-hero{

        display:grid;

        grid-template-columns:1fr;
    }

    .formation-hero__content{

        padding:40px 24px;
    }

    .formation-hero__image{

        border-left:none;

        border-top:1px solid #DED8CC;
    }

    .formation-hero__image img{

        width:100%;

        height:auto;

        display:block;
    }

    .hero-actions{

        display:flex;

        flex-direction:column;

        gap:12px;
    }

    .hero-actions a{

        width:100%;

        text-align:center;
    }

    /* SERVICES */

    .formation-services{

        display:grid;

        grid-template-columns:1fr;

    }

    .formation-service-card{

        padding:40px 24px;

        border-right:none;

        border-bottom:1px solid #DED8CC;
    }

    .formation-service-card:last-child{

        border-bottom:none;
    }

    /* AUDIENCE */

    .audience-grid{

        display:grid;

        grid-template-columns:1fr;

        gap:1px;
    }

    .audience-card{

        padding:24px;
    }

    /* OFFRES */

    .formation-offers{

        display:grid;

        grid-template-columns:1fr;

        gap:24px;

        padding:60px 24px;
    }

    .offer-card{

        padding:28px 24px;
    }

    .offer-btn{

        width:100%;

        text-align:center;
    }

    /* METHODE */

    .formation-method{

        display:grid;

        grid-template-columns:1fr;
    }

    .method-left{

        border-right:none;

        border-bottom:1px solid #DED8CC;

        padding:40px 24px;
    }

    .method-right{

        padding:40px 24px;
    }

    .engagement-item{

        display:flex;

        gap:16px;
    }

    .engagement-icon{

        width:24px;

        height:24px;

        flex-shrink:0;
    }

    /* CTA */

    .formation-cta{

        display:grid;

        grid-template-columns:1fr;
    }

    .formation-cta-left{

        border-right:none;

        border-bottom:1px solid rgba(255,255,255,.08);

        padding:40px 24px;
    }

    .formation-cta-right{

        padding:40px 24px;
    }

    .cta-project-btn,
    .cta-photo-btn{

        width:100%;

        text-align:center;

        display:block;
    }

}