.th-page { overflow: clip; }
.th-page .eyebrow { letter-spacing: .12em; }
.th-hero { padding: var(--space-9) 0 var(--space-10); }
.th-hero__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-5); align-items: center; }
.th-hero__grid > * { min-width: 0; width: 100%; }
.th-hero__copy { max-width: 38.75rem; }
.th-hero__marker { overflow: hidden; margin-bottom: var(--space-5); color: var(--color-encre-gris); font-size: var(--text-annotation); font-weight: 600; letter-spacing: .1em; line-height: var(--line-annotation); text-overflow: clip; white-space: nowrap; }
.th-hero__marker span { display: inline-block; margin-right: var(--space-3); color: var(--color-bleu-klein); }
.th-hero h1 { font-size: clamp(3.25rem, 6vw, 4.5rem); }
.th-hero__lead { max-width: 38rem; font-size: var(--text-body-large); line-height: var(--line-body-large); }
.th-hero__actions { display: flex; flex-wrap: wrap; gap: var(--space-4); align-items: center; min-width: 0; }
.th-hero__actions > * { min-width: 0; }
.th-measure-link { position: relative; display: inline-flex; align-items: center; min-height: 2.75rem; color: var(--color-bleu-klein); font-size: var(--text-meta); font-weight: 600; text-decoration: none; }
.th-measure-link::after { position: absolute; bottom: .2rem; left: 0; width: 2rem; height: 1px; background: currentColor; content: ""; transition: width var(--transition-fast); }
.th-measure-link:hover::after { width: 2.75rem; }
.th-hero__media { position: relative; width: 100%; margin: 0; overflow: hidden; border: var(--border-default); border-radius: var(--radius-soft); aspect-ratio: 3 / 2; }
.th-hero__media img, .th-sequence__media img, .th-cardroom__media img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition-fast); }
.th-hero__media img { object-position: 58% center; }
.th-hero__media:hover img, .th-sequence__media:hover img, .th-cardroom__media:hover img { transform: scale(1.02); }
.th-hero__media figcaption { position: absolute; right: var(--space-3); bottom: var(--space-3); max-width: 16rem; margin: 0; padding: var(--space-2) var(--space-3); background: rgba(247,244,236,.92); }
.th-reality__intro { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 6fr) minmax(0, 2fr); gap: var(--space-5); align-items: start; margin-bottom: var(--space-7); }
.th-reality__intro > * { min-width: 0; }
.th-reality__intro > p { max-width: 38.75rem; font-size: var(--text-body-large); }
.th-reality__cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); }
.th-reality__cards > * { min-width: 0; }
.th-reality__card { display: grid; grid-template-columns: 3rem minmax(0, 1fr); gap: var(--space-3); padding-top: var(--space-4); border-top: var(--border-default); }
.th-reality__card > * { min-width: 0; }
.th-reality__card h3 { font-size: var(--text-card-title); }
.th-index { display: flex; width: 2.75rem; height: 2.75rem; align-items: center; justify-content: center; border: var(--border-strong); color: var(--color-bleu-klein); font-size: var(--text-annotation); font-weight: 600; }
.th-index--green { background: var(--color-vert-amande); color: var(--color-brun-cacao); }
.th-gestures { position: relative; background: var(--color-vert-amande); }
.th-gestures__heading { max-width: 42.5rem; }
.th-gestures__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); margin-top: var(--space-7); }
.th-gestures__grid > * { min-width: 0; padding-right: var(--space-5); border-right: var(--border-default); }
.th-gestures__grid > :last-child { border-right: 0; }
.th-gestures__grid h3 { font-size: var(--text-card-title); }
.th-gestures__note { max-width: 47.5rem; margin-top: var(--space-7); margin-bottom: 0; padding-left: var(--space-4); border-left: 2px solid var(--color-bleu-klein); color: var(--color-encre-gris); font-size: var(--text-meta); }
.th-sequence { padding-top: var(--section-space-major); }
.th-sequence__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-6); align-items: stretch; }
.th-sequence__grid > * { min-width: 0; width: 100%; }
.th-sequence__content h2 { max-width: 37.5rem; }
.th-steps { display: flex; flex-direction: column; gap: var(--space-4); min-width: 0; padding-left: var(--space-5); border-left: var(--border-default); }
.th-steps > * { min-width: 0; }
.th-steps article { padding-bottom: var(--space-4); border-bottom: var(--border-default); }
.th-steps article:last-child { border-bottom: 0; }
.th-steps span, .th-cardroom__notes span { display: block; margin-bottom: var(--space-2); color: var(--color-encre-gris); font-size: var(--text-annotation); font-weight: 600; letter-spacing: .1em; }
.th-steps h3 { margin-bottom: var(--space-3); }
.th-steps__accent { margin-left: calc(var(--space-5) * -1); padding: var(--space-5); background: var(--color-bleu-klein); color: var(--color-craie-blanche); }
.th-steps__accent h3, .th-steps__accent span { color: var(--color-craie-blanche); }
.th-sequence__media { width: 100%; min-height: 35rem; margin: 0; overflow: hidden; border: var(--border-default); border-radius: var(--radius-soft); }
.th-sequence__media img { object-position: center; }
.th-cardroom { background: var(--color-bleu-klein); color: var(--color-craie-blanche); }
.th-cardroom .eyebrow, .th-cardroom h2, .th-cardroom h3, .th-cardroom .th-cardroom__notes span { color: var(--color-craie-blanche); }
.th-cardroom__intro { max-width: 40rem; }
.th-cardroom__intro p:last-child { max-width: 40rem; font-size: var(--text-body-large); }
.th-cardroom__media { width: 100%; margin: var(--space-7) 0 var(--space-5); overflow: hidden; border: 1px solid rgba(247,244,236,.55); aspect-ratio: 16 / 9; }
.th-cardroom__media img { object-position: center; }
.th-cardroom__media figcaption { color: var(--color-craie-blanche); }
.th-cardroom__notes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); }
.th-cardroom__notes > * { min-width: 0; padding-top: var(--space-4); border-top: 1px solid rgba(247,244,236,.45); }
.th-cardroom__notes h3 { font-size: var(--text-card-title); }
.th-practical__intro { max-width: 36.25rem; }
.th-practical__cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); margin-top: var(--space-7); }
.th-practical__cards > * { display: flex; flex-direction: column; min-width: 0; gap: var(--space-4); padding: var(--space-5); border: var(--border-default); background: var(--color-craie-blanche); }
.th-practical__cards h3, .th-practical__cards p, .th-practical__cards address { margin: 0; }
.th-practical__cards address { font-family: var(--font-heading); font-size: 1.35rem; line-height: 1.25; }
.th-practical__cards .button { width: fit-content; margin-top: auto; }
.th-faq__title { max-width: 35rem; }
.th-faq__list { display: flex; flex-direction: column; min-width: 0; gap: 0; width: min(100%, 50rem); margin-top: var(--space-7); }
.th-faq__list > * { min-width: 0; }
.th-faq__item { border-top: var(--border-default); }
.th-faq__item:last-child { border-bottom: var(--border-default); }
.th-faq__item h3 { margin: 0; }
.th-faq__item button { display: grid; grid-template-columns: minmax(0, 1fr) 2rem; gap: var(--space-3); width: 100%; min-height: 3.25rem; padding: var(--space-4) 0; border: 0; border-radius: 0; background: transparent; color: var(--color-brun-cacao); font-family: var(--font-body); font-size: 1rem; font-weight: 600; letter-spacing: 0; line-height: 1.35; text-align: left; text-transform: none; }
.th-faq__item button span { justify-self: end; color: var(--color-bleu-klein); font-size: 1.5rem; font-weight: 400; transition: transform var(--transition-fast); }
.th-faq__item button[aria-expanded="true"] span { transform: rotate(45deg); }
.th-faq__answer { overflow: hidden; max-height: 20rem; padding-right: var(--space-6); transition: max-height var(--transition-page), opacity var(--transition-page); }
.th-faq__answer[hidden] { display: block; max-height: 0; opacity: 0; }
.th-faq__answer p { max-width: 42.5rem; padding-bottom: var(--space-5); }
.th-closing { color: var(--color-craie-blanche); }
.th-closing .eyebrow, .th-closing h2 { color: var(--color-craie-blanche); }
.th-closing__grid { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: var(--space-5); }
.th-closing__grid > * { min-width: 0; }
.th-closing__content { max-width: 45rem; }
.th-closing__content > p:not(.eyebrow):not(.th-closing__address) { max-width: 35rem; font-size: var(--text-body-large); }
.th-closing__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-4); min-width: 0; }
.th-closing__actions > * { min-width: 0; }
.th-closing__contact { color: var(--color-craie-blanche); font-size: var(--text-meta); font-weight: 600; }
.th-closing__address { margin-top: var(--space-5); margin-bottom: 0; color: var(--color-craie-chaude); font-size: var(--text-meta); }
@media (max-width: 63.75rem) { .th-hero__grid { grid-template-columns: 1fr; gap: var(--space-6); } .th-hero__copy { max-width: 38.75rem; } .th-hero__media { order: -1; } .th-sequence__grid { grid-template-columns: 1fr; } .th-sequence__media { order: -1; min-height: 28rem; aspect-ratio: 4 / 3; } .th-steps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-left: 0; padding-left: 0; } .th-steps article { padding: var(--space-4); border: var(--border-default); } .th-steps__accent { margin-left: 0; } }
@media (max-width: 58.75rem) { .th-reality__cards { grid-template-columns: 1fr; gap: var(--space-4); } .th-gestures__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .th-gestures__grid > :nth-child(2) { border-right: 0; } .th-cardroom__notes { grid-template-columns: 1fr; gap: var(--space-4); } }
@media (max-width: 56.25rem) { .th-reality__intro { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); } .th-reality__intro > :last-child { display: none; } }
@media (max-width: 55rem) { .th-practical__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } .th-practical__cards > :last-child { grid-column: 1 / -1; } }
@media (max-width: 51.25rem) { .th-closing__grid { grid-template-columns: 1fr; } .th-closing__space { display: none; } }
@media (max-width: 48rem) { .th-hero { padding: var(--space-7) 0 var(--space-8); } .th-hero h1 { font-size: 2.5rem; line-height: 1.075; } .th-hero__lead { font-size: 1rem; line-height: var(--line-body); } .th-hero__media { aspect-ratio: 4 / 3; } .th-hero__actions { align-items: stretch; flex-direction: column; } .th-hero__actions .button, .th-hero__actions .th-measure-link { width: 100%; } .th-reality__intro { grid-template-columns: 1fr; gap: var(--space-3); margin-bottom: var(--space-6); } .th-reality__intro > :last-child { display: none; } .th-gestures__grid { grid-template-columns: 1fr; gap: 0; margin-top: var(--space-5); } .th-gestures__grid > * { padding: var(--space-5) 0; border-right: 0; border-bottom: var(--border-default); } .th-gestures__grid > :last-child { border-bottom: 0; } .th-gestures__note { margin-top: var(--space-5); } .th-steps { grid-template-columns: 1fr; gap: var(--space-3); } .th-sequence__media { min-height: 0; } .th-cardroom__media { aspect-ratio: 4 / 3; margin-top: var(--space-5); } .th-cardroom__media figcaption { position: static; padding: var(--space-2) 0; } .th-practical__cards { grid-template-columns: 1fr; margin-top: var(--space-5); gap: var(--space-4); } .th-practical__cards > :last-child { grid-column: auto; } .th-practical__cards .button { width: 100%; } .th-faq__list { width: 100%; margin-top: var(--space-5); } .th-faq__answer { padding-right: 0; } .th-closing__actions { align-items: stretch; flex-direction: column; } .th-closing__actions .button, .th-closing__contact { width: 100%; } }
@media (prefers-reduced-motion: reduce) { .th-hero__media img, .th-sequence__media img, .th-cardroom__media img, .th-faq__answer, .th-faq__item button span { transition: none; } .th-hero__media:hover img, .th-sequence__media:hover img, .th-cardroom__media:hover img { transform: none; } }