/* Masterminds — feuille commune aux 6 pages.
   Mise en page : colonnes centrées sur fond noir, sections séparées par un filet ; structure de pages façon TeamOut, en plus court. */
:root{
  --noir:#000000; --releve:#141414; --ligne:#262626; --blanc:#FFFFFF; --doux:#CFCFCB; --gris:#8A8A86; --rouge:#FF3B1F;
  --f-titre:"Fraunces",Georgia,serif; --f-texte:"Inter Tight","Helvetica Neue",Arial,sans-serif;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--noir);color:var(--blanc);font:400 17px/1.6 var(--f-texte);-webkit-font-smoothing:antialiased}
a{color:inherit}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,.seat:focus-visible{outline:2px solid var(--rouge);outline-offset:3px}
img{max-width:100%}
.wrap{max-width:1180px;margin:0 auto;padding-inline:20px}
.k{font:500 12px var(--f-texte);letter-spacing:.2em;text-transform:uppercase;color:var(--gris)}
.k.r{color:var(--rouge)}
h1,h2,h3{font-family:var(--f-titre);font-weight:400;letter-spacing:-.02em;text-wrap:balance;margin:0}
p{margin:0}
.btn{display:inline-flex;align-items:center;gap:10px;background:var(--rouge);color:var(--noir);font:600 15px var(--f-texte);padding:15px 22px;text-decoration:none;border:0;cursor:pointer}
.btn:hover{background:#ff5a42}
.btn2{display:inline-flex;align-items:center;gap:10px;border:1px solid #ffffff55;color:var(--blanc);font:500 15px var(--f-texte);padding:14px 21px;text-decoration:none}
.btn2:hover{border-color:var(--blanc)}
.more{font-weight:500;font-size:15px;text-decoration:none;border-bottom:1px solid var(--rouge);padding-bottom:2px}
.more:hover{color:var(--rouge)}
.cta{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}

/* En-tête */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:10;background:#000000e6;backdrop-filter:blur(8px);border-bottom:1px solid var(--ligne)}
.top .wrap{display:flex;align-items:center;gap:24px;height:72px}
.top .logo img{height:40px;width:auto;display:block}
.top nav{margin-left:auto;display:flex;gap:26px}
.top nav a{text-decoration:none;font-size:14px;color:var(--doux)}
.top nav a:hover,.top nav a[aria-current="page"]{color:var(--blanc)}
.top nav a[aria-current="page"]{box-shadow:0 1px 0 var(--rouge)}
.top .btn{padding:11px 16px;font-size:14px}

/* Héros d'accueil et en-têtes de page */
.hero{padding-block:96px 40px;text-align:center;display:grid;justify-items:center;gap:26px}
.hero h1{font-size:clamp(42px,7vw,98px);line-height:.98;max-width:15ch}
.hero .sub{font-size:clamp(19px,1.8vw,23px);color:var(--blanc);max-width:40ch;line-height:1.45}
.hero .sub b{font-weight:500;color:var(--rouge)}
.hero .first{font-size:14px;color:var(--gris)}
.phead{padding-block:96px 64px;text-align:center;display:grid;justify-items:center;gap:22px;border-bottom:1px solid var(--ligne)}
.phead h1{font-size:clamp(40px,6vw,84px);line-height:1;max-width:16ch}
.phead p{color:var(--doux);max-width:56ch;font-size:clamp(17px,1.5vw,20px)}

/* Sections */
section{padding-block:110px;border-top:1px solid var(--ligne);scroll-margin-top:72px}
.sh{text-align:center;display:grid;justify-items:center;gap:18px;margin-bottom:56px}
.sh h2{font-size:clamp(36px,5vw,66px);line-height:1;max-width:18ch}
.sh p{color:var(--doux);max-width:56ch}

/* « Vous avez envie de réunir vos clients » */
.charge{text-align:center;display:grid;justify-items:center;gap:22px}
.charge h2{font-size:clamp(34px,4.6vw,60px);line-height:1.05;max-width:20ch}
.charge h2 em{font-style:italic;color:var(--doux)}
.charge p{color:var(--doux);max-width:58ch}

/* Philosophie : texte posé ligne à ligne, comme une lettre */
.philo{max-width:760px;margin:0 auto;text-align:center;display:grid;gap:26px}
.philo p{font:400 clamp(22px,2.4vw,30px)/1.35 var(--f-titre);letter-spacing:-.01em;color:#E6E6E3}
.philo p.dim{color:var(--gris)}
.philo .sign{font:500 15px var(--f-texte);color:var(--doux);letter-spacing:0}
.philo .sign b{display:block;color:var(--blanc);font-weight:600}

/* Grilles de cartes */
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.card{background:var(--releve);padding:32px 28px 34px;display:grid;gap:12px;align-content:start}
.card h3{font-size:clamp(24px,2.2vw,30px);line-height:1.1}
.card p{color:var(--doux);font-size:16px}
.card .ico{width:14px;height:14px;border-radius:50%;background:var(--blanc)}
.card .ico.r{background:var(--rouge)}

/* Formats : liste façon « événements couverts toute l'année » */
.fmts{border-top:1px solid var(--ligne)}
.fmt{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.6fr) auto;gap:24px 48px;align-items:center;padding:30px 0;border-bottom:1px solid var(--ligne);text-decoration:none}
.fmt h3{font-size:clamp(28px,3vw,40px);line-height:1.05}
.fmt p{color:var(--doux)}
.fmt .go{width:44px;height:44px;border-radius:50%;border:1px solid #ffffff55;display:grid;place-items:center;font-size:18px}
a.fmt:hover .go{background:var(--rouge);border-color:var(--rouge);color:var(--noir)}
a.fmt:hover h3{color:var(--blanc)}

/* Étapes */
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--ligne);border:1px solid var(--ligne)}
.step{background:var(--noir);padding:34px 30px 38px;display:grid;gap:12px;align-content:start}
.step b{font:400 54px/1 var(--f-titre);color:var(--blanc)}
.step b i{font-style:normal;color:var(--rouge)}
.step h3{font-size:26px}
.step p{color:var(--doux);font-size:16px}

/* Chiffres du format */
.figs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;text-align:center}
.fig{border-top:1px solid var(--blanc);padding-top:18px;display:grid;gap:6px}
.fig b{font:400 clamp(56px,7vw,96px)/.95 var(--f-titre);letter-spacing:-.03em}
.fig span{color:var(--doux)}

/* Promesse */
.prom{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:1px solid var(--ligne)}
.prom div{padding:30px 26px 0;display:grid;gap:10px;align-content:start;text-align:center;justify-items:center}
.prom div+div{border-left:1px solid var(--ligne)}
.prom i{width:16px;height:16px;border-radius:50%;background:var(--blanc)}
.prom div:first-child i{background:var(--rouge)}
.prom h3{font-size:26px;line-height:1.1}
.prom p{color:var(--doux);font-size:16px}

/* Rémunération à la performance */
.perf{display:grid;justify-items:center;text-align:center;gap:24px;background:var(--releve);padding:72px 32px}
.perf h2{font-size:clamp(34px,4.6vw,60px);line-height:1.05;max-width:20ch}
.perf .line{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 28px;font:500 13px var(--f-texte);letter-spacing:.16em;text-transform:uppercase;color:var(--gris)}
.perf .line span{display:inline-flex;align-items:center;gap:10px}
.perf .line span::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--gris)}
.perf .line span.on{color:var(--blanc)}
.perf .line span.on::before{background:var(--rouge)}
.perf p{color:var(--doux);max-width:56ch}

/* Vous / Nous */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:16px}
.col{background:var(--releve);padding:36px;display:grid;gap:20px;align-content:start}
.col h3{font-size:30px}
.col ul{margin:0;padding:0;list-style:none;display:grid;gap:14px}
.col li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;color:#E6E6E3}
.col li::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--blanc);margin-top:.55em}
.col.us li::before{background:var(--rouge)}
.col .note{font-size:14px;color:var(--gris)}

/* Édition type */
.days{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.day{border:1px solid var(--ligne);padding:30px;display:grid;gap:16px;align-content:start}
.day h3{font-size:32px}
.day ol{margin:0;padding:0;list-style:none;display:grid;gap:10px;color:#E6E6E3}
.day li{display:grid;grid-template-columns:88px minmax(0,1fr);gap:10px}
.day li span{color:var(--gris);font-variant-numeric:tabular-nums;font-size:14px;padding-top:2px}

/* Lieux */
.places{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.place{background:var(--releve);display:grid;align-content:start}
.place .pic{aspect-ratio:4/3;max-width:100%;position:relative;overflow:hidden;background:#0b0b0b}
.place .pic svg{position:absolute;inset:0;width:100%;height:100%}
.place .b{padding:24px 26px 30px;display:grid;gap:10px}
.place h3{font-size:28px;line-height:1.1}
.place p{color:var(--doux);font-size:16px}
.place dl{margin:6px 0 0;display:grid;gap:6px;font-size:14px}
.place dl div{display:flex;justify-content:space-between;gap:12px;border-top:1px solid var(--ligne);padding-top:6px}
.place dt{color:var(--gris)}
.place dd{margin:0;color:var(--blanc);text-align:right}
.crit{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}

/* Questions */
.faq{max-width:860px;margin:0 auto}
.faq details{border-top:1px solid var(--ligne)}
.faq details:last-child{border-bottom:1px solid var(--ligne)}
.faq summary{list-style:none;cursor:pointer;padding:24px 40px 24px 0;font:400 clamp(21px,2.2vw,27px)/1.25 var(--f-titre);position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:6px;top:50%;width:12px;height:12px;border-radius:50%;border:1px solid var(--blanc);transform:translateY(-50%)}
.faq details[open] summary::after{background:var(--rouge);border-color:var(--rouge)}
.faq details p{padding:0 0 26px;color:var(--doux);max-width:62ch}

/* Bandeau d'appel en bas de page */
.final{text-align:center;display:grid;justify-items:center;gap:24px}
.final h2{font-size:clamp(40px,6vw,84px);line-height:1;max-width:16ch}
.final p{color:var(--doux);max-width:48ch}
.final img{width:110px;height:auto}

/* Contact */
.contact{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:start}
.contact h2{font-size:clamp(36px,4.6vw,60px);line-height:1}
.contact .lead{color:var(--doux);margin-top:18px;max-width:42ch}
.contact ol{margin:28px 0 0;padding:0;list-style:none;display:grid;gap:16px}
.contact ol li{display:grid;grid-template-columns:36px minmax(0,1fr);gap:12px;color:#E6E6E3}
.contact ol li b{font:400 24px/1 var(--f-titre);color:var(--rouge)}
form{display:grid;gap:14px;background:var(--releve);padding:32px}
label{display:grid;gap:6px;font-size:14px;color:var(--doux)}
input,select,textarea{font:400 16px var(--f-texte);color:var(--blanc);background:var(--noir);border:1px solid #333;padding:13px 14px;border-radius:0;width:100%}
textarea{min-height:120px;resize:vertical}
.row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ok{font-size:14px;color:var(--doux);border-left:2px solid var(--rouge);padding-left:12px}

/* Logo interactif (accueil) */
.orbit{padding-block:10px 40px}
.orbit .hint{text-align:center;color:var(--gris);font-size:14px}
.stage{position:relative;max-width:1100px;margin:0 auto}
.stage svg{display:block;width:100%;height:auto;overflow:visible}
.seat{cursor:pointer}
.seat .dot{fill:var(--blanc);transition:opacity .25s}
.seat .ring{fill:none;stroke:var(--blanc);stroke-width:.8;opacity:0;transition:opacity .25s}
.seat .hit{fill:transparent}
.seat.center .dot{fill:var(--rouge)}
.seat.center .ring{stroke:var(--rouge)}
.stage.has-active .seat:not(.on):not(.center) .dot{opacity:.38}
.seat.on .ring{opacity:.9}
.br{opacity:0;transition:opacity .3s;pointer-events:none}
.br.on{opacity:1}
.br line{stroke:#ffffff8c;stroke-width:.6;stroke-dasharray:120;stroke-dashoffset:120;transition:stroke-dashoffset .55s ease}
.br.on line{stroke-dashoffset:0}
.br circle{fill:var(--blanc)}
.br text{fill:var(--blanc);font:400 7px var(--f-texte)}
.panel{max-width:720px;margin:6px auto 0;text-align:center;display:grid;gap:12px;justify-items:center;min-height:250px;align-content:start}
.panel .k{color:var(--rouge)}
.panel h2{font-size:clamp(30px,3.6vw,46px);line-height:1.05}
.panel p{color:var(--doux);max-width:56ch}
.chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:6px 0 0;padding:0;list-style:none}
.chips li{font-size:14px;border:1px solid #ffffff40;padding:6px 12px}
.dots{display:flex;gap:10px;justify-content:center;margin-top:8px}
.dots button{width:30px;height:30px;border-radius:50%;border:1px solid #ffffff40;background:transparent;color:var(--doux);font:500 11px var(--f-texte);cursor:pointer}
.dots button[aria-pressed="true"]{background:var(--blanc);color:var(--noir);border-color:var(--blanc)}

/* Pied de page */
footer{border-top:1px solid var(--ligne);padding-block:56px 60px}
footer .wrap{display:grid;grid-template-columns:minmax(0,1.2fr) repeat(2,minmax(0,1fr));gap:32px 40px}
footer img{height:36px;width:auto;display:block}
footer .tag{margin-top:16px;color:var(--doux);font-size:15px;max-width:34ch}
footer h4{margin:0 0 12px;font:500 12px var(--f-texte);letter-spacing:.2em;text-transform:uppercase;color:var(--gris)}
footer ul{margin:0;padding:0;list-style:none;display:grid;gap:8px}
footer ul a{text-decoration:none;color:var(--doux);font-size:15px}
footer ul a:hover{color:var(--blanc)}
footer .legal{grid-column:1/-1;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;border-top:1px solid var(--ligne);padding-top:22px;font-size:14px;color:var(--gris)}
footer .legal a{color:var(--gris);text-decoration:none}

@media (max-width:900px){
  .top nav{display:none}
  .split,.contact{grid-template-columns:1fr}
  .grid3,.steps,.days,.places{grid-template-columns:1fr}
  .grid2{grid-template-columns:1fr}
  .figs{grid-template-columns:1fr}
  .prom{grid-template-columns:repeat(2,minmax(0,1fr))}
  .prom div:nth-child(3){border-left:0}
  .prom div{padding-bottom:30px;border-bottom:1px solid var(--ligne)}
  .crit{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fmt{grid-template-columns:minmax(0,1fr) auto}
  .fmt p{grid-column:1/-1;grid-row:2}
  .br text{display:none}
  section{padding-block:80px}
  footer .wrap{grid-template-columns:1fr 1fr}
  footer .brand{grid-column:1/-1}
}
@media (max-width:520px){
  .row{grid-template-columns:1fr}
  .top .btn{display:none}
  .hero,.phead{padding-top:60px}
  form,.col{padding:24px}
  .prom,.crit{grid-template-columns:1fr}
  .prom div+div{border-left:0}
  .perf{padding:52px 20px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .br,.br line,.seat .dot,.seat .ring{transition:none}
}
.trap{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.ok.err{border-left-color:#ffffff88}
