.vert{color: var(--brand)}
.section{padding: 48px 0}
@media (min-width: 768px){.section{padding: 64px 0} }
.section--douce{background: var(--surface); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border)}
.section-entete{margin-bottom: var(--e-8); max-width: 44rem}
.section-titre{font: 700 clamp(1.75rem, 1.4rem + 1.4vw, 2.5rem)/1.15 var(--font-ui); letter-spacing: -.02em; color: var(--text)}
.section-intro{margin-top: var(--e-2); color: var(--text-secondary); font-size: 1.0625rem; line-height: 1.6}
.section-suite{margin-top: var(--e-6)}
.hero{padding: var(--e-8) 0 48px}
.hero-grille{display: grid; gap: var(--e-6)}
.hero-texte, .hero-actions-bloc, .scene, .scene-liste{min-width: 0}
.hero-surtitre{margin-bottom: var(--e-3); font: 600 .9375rem/1.4 var(--font-ui); color: var(--brand)}
.hero-titre{max-width: 23ch; font: 700 clamp(2rem, 1.25rem + 3vw, 3.5rem)/1.08 var(--font-ui); letter-spacing: -.035em; color: var(--text); text-wrap: balance}
.hero-sous-titre{margin-top: var(--e-4); max-width: 48ch; font-size: 1.0625rem; line-height: 1.55; color: var(--text-secondary)}
.hero-actions{display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-2) var(--e-6)}
.hero-cta{padding: 0 var(--e-6)}
.hero-cta .ico{color: var(--highlight)}
.hero-marque{padding: 0 .14em; white-space: nowrap}
@media (max-width: 359px){.hero-marque{white-space: normal} }
.hero-mention{margin-top: var(--e-2); font-size: .9375rem; color: var(--text-secondary)}
.scene{display: grid; gap: var(--e-3); align-content: start; margin: 0}
.scene-legende{font: 600 .875rem/1.4 var(--font-ui); color: var(--text-secondary)}
.scene-vedette{display: grid; gap: .5rem}
body.site-corps .scene-photo{width: 100%; height: auto; max-height: 23rem; object-fit: cover; border-radius: var(--r-tile)}
.scene-vedette-texte{display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem var(--e-3)}
.scene-vedette-titre{font: 700 1.1875rem/1.3 var(--font-ui); letter-spacing: -.01em; overflow-wrap: anywhere}
.scene-credit{font-size: .8125rem; color: var(--text-secondary)}
.scene-liste{display: grid; grid-template-columns: minmax(0, 1fr); align-content: start; border-top: 1px solid var(--border)}
.scene-liste .ui-rangee{display: grid; grid-template-columns: 3.5rem minmax(0, 1fr); align-items: center; gap: var(--e-3); padding: .625rem 0}
.scene-liste .ui-rangee-photo{width: 3.5rem; height: 3.5rem}
.scene-liste .ui-rangee:not(:has(.ui-rangee-photo)){grid-template-columns: minmax(0, 1fr)}
.scene-liste .ui-rangee-corps{display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .125rem var(--e-2); min-width: 0}
.scene-liste .ui-rangee-jour{grid-column: 1 / -1}
.scene-liste .ui-rangee-meta{align-self: center; white-space: nowrap}
@media (min-width: 700px){.hero-grille{grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); grid-template-areas: "texte texte" "actions actions" "scene liste"; gap: var(--e-6) var(--e-8)}
.hero-texte{grid-area: texte}
.hero-actions-bloc{grid-area: actions}
.scene{grid-area: scene}
.scene-liste{grid-area: liste}
}
@media (min-width: 1100px){.hero{padding-top: 48px; padding-bottom: 64px}
.hero-grille{grid-template-areas: "texte actions" "scene liste"; gap: var(--e-8) 48px}
.hero-actions-bloc{align-self: center; justify-self: start}
.hero-actions{flex-direction: column; align-items: flex-start}
}
.section--filet{border-top: 1px solid var(--border)}
.comment-grille{display: grid; gap: var(--e-6)}
.comment-texte{display: grid; gap: var(--e-4); align-content: start; min-width: 0}
.etapes{display: grid; gap: var(--e-4); counter-reset: etape; list-style: none; padding: 0; margin: 0}
.etapes li{position: relative; padding-left: 2.5rem; color: var(--text-secondary); line-height: 1.55; counter-increment: etape}
.etapes li::before{content: counter(etape); position: absolute; left: 0; top: .0625rem; display: grid; place-items: center; width: 1.75rem; height: 1.75rem; border-radius: 50%; background: var(--highlight); color: var(--text); font: 700 .9375rem/1 var(--font-ui)}
.etapes strong{color: var(--text)}
.liste-exemple{display: grid; gap: var(--e-4); min-width: 0; align-content: start; margin: 0; padding: var(--e-6); background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-tile)}
.liste-exemple-repas{display: flex; align-items: center; gap: var(--e-4)}
.liste-exemple-repas .ui-photo{width: 7rem; height: 5.5rem; flex: none}
.liste-exemple-repas div{display: grid; gap: var(--e-1); min-width: 0}
.liste-exemple-repas strong{font-size: 1.25rem}
.liste-exemple-repas span{color: var(--text-secondary); font-size: .9375rem}
.liste-exemple-portions{font-size: .9375rem}
.liste-exemple-quantite{white-space: nowrap; font-variant-numeric: tabular-nums; font-weight: 600}
.liste-exemple-groupe{display: grid; gap: .25rem}
.liste-exemple-ligne{display: flex; align-items: baseline; justify-content: space-between; gap: var(--e-3); padding: .625rem 0}
.liste-exemple-prix{flex: none}
.liste-exemple-note{font-size: .875rem; color: var(--text-secondary)}
@media (min-width: 900px){.comment-grille{grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 64px; align-items: start} }
.enseignes-liste{display: flex; flex-wrap: wrap; gap: var(--e-2) var(--e-6); margin: var(--e-4) 0}
.enseignes-liste li{font: 700 1.125rem/1.3 var(--font-ui); color: var(--text); letter-spacing: -.01em}
.semaine{padding: 0 0 48px}
.semaine .section-titre{margin-bottom: var(--e-3)}
.semaine-chiffre{margin-top: var(--e-2); color: var(--text-secondary)}
.semaine-chiffre strong{color: var(--text); font-variant-numeric: tabular-nums}
.semaine-liste{margin: var(--e-4) 0; border-top: 1px solid var(--border)}
.semaine-ligne{display: flex; align-items: center; justify-content: space-between; gap: var(--e-4); padding: var(--e-3) 0; border-bottom: 1px solid var(--border)}
.semaine-nom{font-weight: 600; min-width: 0; overflow-wrap: anywhere}
.semaine-prix{flex: none; text-align: right}
.faq-liste{border-top: 1px solid var(--border)}
.faq-item{border-bottom: 1px solid var(--border)}
.faq-item summary{display: flex; align-items: center; justify-content: space-between; gap: var(--e-4); min-height: 3.5rem; padding: var(--e-3) 0;
font: 600 1.0625rem/1.4 var(--font-ui); color: var(--text); cursor: pointer; list-style: none}
.faq-item summary::-webkit-details-marker{display: none}
.faq-item summary:hover{color: var(--brand)}
.faq-ico{transition: transform .15s ease; color: var(--text-secondary)}
.faq-item[open] .faq-ico{transform: rotate(180deg)}
.faq-item > :not(summary){padding: 0 0 var(--e-4); color: var(--text-secondary); max-width: 44rem}
.faq-item > p + p{margin-top: calc(var(--e-2) * -1)}
.faq-item p strong{color: var(--text)}
.faq-groupe{margin-top: var(--e-8)}
.faq-groupe:first-child{margin-top: 0}
.faq-groupe-titre{margin-bottom: var(--e-3); font: 700 1.375rem/1.25 var(--font-ui); letter-spacing: -.015em}
.final{padding: 56px 0; background: var(--highlight); color: var(--text)}
.final-carte{display: grid; gap: var(--e-3); justify-items: start}
.final .section-titre{color: var(--text)}
.page-entete{padding-top: var(--e-8); padding-bottom: var(--e-6)}
@media (min-width: 768px){.page-entete{padding-top: 48px; padding-bottom: var(--e-8)} }
.page-entete .ui-sous-titre{max-width: 42rem; font-size: 1.125rem; margin-top: var(--e-3)}
.page-ancres{display: flex; flex-wrap: wrap; gap: var(--e-2); margin-top: var(--e-6)}
.page-ancres .ui-chip{white-space: normal; min-width: 0; max-width: 100%}
.page-corps{padding-bottom: 64px}
.chapitre{padding: var(--e-8) 0; border-top: 1px solid var(--border)}
.chapitre:first-of-type{border-top: 0; padding-top: 0}
.chapitre-titre{font: 700 clamp(1.5rem, 1.2rem + 1.2vw, 2rem)/1.2 var(--font-ui); letter-spacing: -.02em}
.chapitre-intro{margin: var(--e-2) 0 var(--e-6); max-width: 46rem; color: var(--text-secondary); font-size: 1.0625rem}
.points{display: grid; gap: 0 var(--e-8)}
@media (min-width: 900px){.points{grid-template-columns: repeat(3, minmax(0, 1fr))} }
.point{display: grid; gap: var(--e-2); align-content: start; padding: var(--e-4) 0; border-top: 1px solid var(--border)}
.point h3{font: 700 1.125rem/1.3 var(--font-ui)}
.point p{color: var(--text-secondary)}
.chapitre-note{margin-top: var(--e-4); font-size: .9375rem; color: var(--text-secondary)}
.outils{display: grid; gap: var(--e-4)}
@media (min-width: 768px){.outils{grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-4) var(--e-8)} }
.outil{display: grid; gap: .25rem; padding: var(--e-4) 0; border-top: 1px solid var(--border)}
.outil h3{font: 700 1.0625rem/1.3 var(--font-ui)}
.outil p{color: var(--text-secondary)}
.carte-prix{display: grid; gap: var(--e-4); padding: var(--e-4) 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border)}
@media (min-width: 768px){.carte-prix{grid-template-columns: minmax(0, 1fr) auto; align-items: center} }
.carte-prix-montant{text-align: left}
@media (min-width: 768px){.carte-prix-montant{text-align: right} }
.plans{display: grid; gap: var(--e-4)}
@media (min-width: 900px){.plans{grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-4) var(--e-8); align-items: stretch} }
.plan-detail{display: grid; gap: var(--e-3); align-content: start; padding-top: var(--e-4); border-top: 1px solid var(--border)}
.plan-etiquette{font: 600 .875rem/1.4 var(--font-ui); letter-spacing: .06em; text-transform: uppercase; color: var(--brand)}
.plan-detail-nom{font: 700 1.5rem/1.2 var(--font-ui); letter-spacing: -.015em}
.plan-detail-prix{display: flex; flex-wrap: wrap; align-items: baseline; gap: .375rem}
.plan-detail-annuel{color: var(--text-secondary); font-size: .9375rem}
.plan-detail--recommande{border-top: 3px solid var(--brand); padding-top: calc(var(--e-4) - 2px)}
.liste-coches{display: grid; gap: var(--e-2)}
.liste-coches li{display: flex; align-items: flex-start; gap: var(--e-3)}
.liste-coches .ico{margin-top: .125rem; color: var(--brand); width: 1.125rem; height: 1.125rem; stroke-width: 2.25}
.plan-detail .ui-btn{margin-top: var(--e-2)}
.confiance{display: flex; flex-wrap: wrap; gap: var(--e-2) var(--e-6); margin-top: var(--e-6); color: var(--text-secondary); font-size: .9375rem}
.reception{margin-top: var(--e-8); padding: var(--e-8) 0 0; border-top: 1px solid var(--border)}
.reception-grille{display: grid; gap: var(--e-6)}
@media (min-width: 900px){.reception-grille{grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); align-items: center} }
.reception-prix{display: grid; gap: var(--e-3)}
.reception-ligne{display: flex; flex-wrap: wrap; align-items: baseline; gap: .375rem var(--e-3)}
.reception-ligne span{color: var(--text-secondary)}
.engagement{margin: var(--e-8) 0; padding: var(--e-4) 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); font: 600 1.125rem/1.5 var(--font-ui); max-width: 46rem}
.cta-bas{margin-top: var(--e-8); display: grid; gap: var(--e-3); justify-items: start}
.cta-bas-actions{display: flex; flex-wrap: wrap; gap: var(--e-3)}
.contact-grille{display: grid; gap: var(--e-8)}
@media (min-width: 1024px){.contact-grille{grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); align-items: start} }
.contact-infos{display: grid; gap: var(--e-4)}
.contact-infos div{display: grid; gap: .125rem; padding-bottom: var(--e-4); border-bottom: 1px solid var(--border)}
.contact-infos dt{font: 600 .875rem/1.3 var(--font-ui); letter-spacing: .06em; text-transform: uppercase; color: var(--text-secondary)}
.contact-infos dd{margin: 0; font-weight: 600; overflow-wrap: anywhere}
.contact-infos dd.ui-secondaire{font-weight: 400}
.contact-form .ui-btn{margin-top: var(--e-2)}
.prose{max-width: 46rem; line-height: 1.7}
.prose h2{margin: var(--e-8) 0 var(--e-2); font: 700 1.375rem/1.3 var(--font-ui); letter-spacing: -.01em}
.prose p{margin: 0 0 var(--e-3)}
.prose ul{margin: 0 0 var(--e-4); padding-left: 1.25rem; list-style: disc}
.prose li{margin-bottom: var(--e-2); padding-left: .25rem}
.prose a{color: var(--brand)}
.prose-maj{margin-top: var(--e-2); color: var(--text-secondary)}
.prose-encadre{margin: var(--e-6) 0; padding: var(--e-4) var(--e-6); border-radius: var(--r-card); background: var(--brand-soft)}
.prose-encadre-titre{margin-bottom: var(--e-2); font: 600 .875rem/1.3 var(--font-ui); letter-spacing: .06em; text-transform: uppercase; color: var(--text-secondary)}
.prose-encadre p:last-child{margin-bottom: 0}
.invite-page{display: flex; justify-content: center; padding: var(--e-8) var(--e-4) 64px}
.invite-card{width: 100%; max-width: 32.5rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-card); box-shadow: 0 2px 8px rgba(0, 0, 0, .04); padding: var(--e-6)}
@media (min-width: 480px){.invite-card{padding: var(--e-8)} }
.invite-eyebrow{margin-bottom: var(--e-2); font: 600 .875rem/1.3 var(--font-ui); letter-spacing: .06em; text-transform: uppercase; color: var(--text-secondary)}
.invite-title{margin-bottom: var(--e-2); font: 700 1.75rem/1.2 var(--font-ui); letter-spacing: -.02em}
.invite-title em{font-style: normal; color: var(--brand)}
.invite-sub{margin-bottom: var(--e-4); color: var(--text-secondary)}
.invite-intro{margin-bottom: var(--e-4); line-height: 1.6}
.invite-form{display: grid; gap: var(--e-4)}
.invite-field{display: grid; gap: .375rem}
.invite-field label{font: 600 .9375rem/1.3 var(--font-ui)}
.invite-field input{display: block; width: 100%; min-height: 3rem; padding: .625rem 1rem; border: 1px solid var(--border); border-radius: var(--r-field);
background: var(--surface); color: var(--text); font: 400 1rem/1.4 var(--font-ui)}
.invite-field input:focus-visible{outline: none; box-shadow: 0 0 0 3px var(--surface), 0 0 0 5px var(--brand)}
.invite-hint{margin: 0; font-size: .875rem; color: var(--text-secondary)}
.invite-btn{display: inline-flex; align-items: center; justify-content: center; min-height: 3rem; padding: 0 var(--e-6); border: 1px solid transparent;
border-radius: var(--r-btn); background: var(--brand); color: #fff; font: 600 1rem/1.2 var(--font-ui); cursor: pointer; transition: background-color .15s ease}
.invite-btn:hover{background: var(--brand-hover)}
.invite-btn:focus-visible{outline: none; box-shadow: 0 0 0 3px var(--surface), 0 0 0 5px var(--brand)}
.invite-fineprint{margin-top: var(--e-6); font-size: .875rem; line-height: 1.6; color: var(--text-secondary); text-align: center}
.invite-error{margin-bottom: var(--e-4); padding: var(--e-3) var(--e-4); border-radius: var(--r-tile); background: var(--danger-soft); border: 1px solid #f2c4bf; color: var(--text); font-size: .9375rem}
.invite-card-merci, .invite-card-expire{text-align: center}
@media (prefers-reduced-motion: reduce){.faq-ico, .invite-btn{transition: none}
}
.section-titre + .faq-liste, .section-intro + .faq-liste{margin-top: var(--e-6)}
.contact-infos{margin-top: var(--e-6)}
.contact-form{margin-top: var(--e-4)}
.ui-champ [aria-invalid="true"]{border-color: var(--danger)}