/* Shared multi-page composition. The fifteen brand colors remain in tokens.css. */
.site-page { --page-nav-height: 64px; }
.site-page .page-main { padding-top: var(--page-nav-height); }
.site-page.party-page .page-main { padding-top: 0; }
.site-page :is(.hero-copy, .hero-art, .product-copy, .product-media, .custom-panel, .custom-tile, .project-aside, .project-summary) { min-width: 0; }
.site-page .page-main :is(h1, h2, h3, p, a, label, summary) { overflow-wrap: anywhere; }
.site-page .page-main h1 { font-size: 40px; line-height: 44px; }
.site-page .lead { max-width: 55ch; font-size: 18px; line-height: 28px; color: var(--color-text-secondary); text-wrap: pretty; }
.site-page .eyeline { max-width: 55ch; font-size: 14px; line-height: 22px; color: var(--color-text-secondary); }
.site-page .actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 28px; }
.site-page .actions .button { max-width: 100%; }
.site-page .button-secondary { border-color: var(--color-border-control); }
.site-page .section-top { display: grid; gap: 16px; margin-bottom: 32px; }
.site-page .section-top > p { max-width: 46ch; color: var(--color-text-secondary); }
.site-page .surface-section { background: var(--color-surface); }
.site-page .compact-hero .lead { margin-top: 24px; }
.site-page .breadcrumb { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: center; margin-bottom: 24px; font-size: 14px; line-height: 22px; color: var(--color-text-secondary); }
.site-page .breadcrumb a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: underline; }
.site-page .breadcrumb [aria-current] { color: var(--color-text-primary); }

/* Native details provide a keyboard-operable needs menu at every size. */
.site-page .nav-links > a,
.site-page .needs-menu > summary { min-height: 44px; font-weight: 500; }
.site-page .nav-links > a[aria-current='page'],
.site-page .needs-menu > summary[aria-current='page'] { text-decoration: underline; text-decoration-color: var(--color-text-on-dark); text-decoration-thickness: 2px; text-underline-offset: 8px; }
.site-page .needs-menu { min-width: 0; }
.site-page .needs-menu > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; cursor: pointer; list-style: none; }
.site-page .needs-menu summary::-webkit-details-marker { display: none; }
.site-page .needs-menu > summary::after { content: ''; flex-shrink: 0; width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); margin: -4px 2px 0 0; }
.site-page .needs-menu[open] > summary::after { transform: rotate(225deg); margin-top: 4px; }
.site-page .needs-dropdown { display: grid; gap: 0; padding: 8px 0 0; }
.site-page .needs-dropdown > a { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 48px; padding-block: 12px; color: inherit; border-top: 1px solid var(--color-border-control); }
.site-page .needs-dropdown > a:first-child { border-top: 0; }
.site-page .needs-dropdown > .nav-overview { font-size: 14px; text-decoration: underline; }
.site-page .nav-custom { display: grid; gap: 4px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--color-border-control); }
.site-page .nav-custom > p { margin-bottom: 0; font-weight: 600; }
.site-page .nav-custom > a { justify-content: space-between; text-decoration: none; line-height: 22px; }
.site-page .nav-custom > a:hover { text-decoration: underline; }
.site-page .usage-next { display: inline-flex; align-items: center; gap: 16px; margin-top: 24px; color: var(--color-action); font-size: 16px; line-height: 24px; }
.site-page .usage-detail { max-width: 60ch; margin-top: 24px; color: var(--color-text-secondary); }
.site-page .usage-filters { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 32px; }
.site-page .usage-filters button { min-height: 44px; padding: 10px 20px; border: 1px solid var(--color-border-control); border-radius: 999px; color: var(--color-text-primary); background: var(--color-surface); }
.site-page .usage-filters button[aria-pressed="true"] { background: var(--color-action-soft); border-color: var(--color-action); color: var(--color-action); }
.site-page .usage-form { max-width: 1100px; margin-inline: auto; }
.site-page .usage-form .form-group { margin-block: 0 48px; }
.site-page .usage-form legend { font-size: 24px; line-height: 30px; margin-bottom: 20px; }
.site-page .mode-options, .site-page .robot-options { display: flex; flex-wrap: wrap; gap: 16px; }
.site-page .mode-options label,.site-page .robot-option { display: flex; align-items: flex-start; gap: 12px; padding: 24px; border: 1px solid var(--color-border-control); border-radius: 16px; flex: 1 1 220px; }
.site-page .mode-options label:has(:checked),.site-page .robot-option:has(:checked),.site-page .outfit-card:has(:checked) { border-color: var(--color-action); background: var(--color-action-soft); }
.site-page .mode-options small,.site-page .robot-option span span { display: block; color: var(--color-text-secondary); margin-top: 8px; }
.site-page .outfit-grid { display: grid; grid-template-columns: minmax(0,1fr); gap: 24px; margin-block: 24px; }
.site-page .outfit-card { position: relative; display: flex; flex-direction: column; height: 100%; overflow: hidden; border: 1px solid var(--color-border-control); border-radius: 20px; background: var(--color-surface); cursor: pointer; }
.site-page .outfit-card > input { position: absolute; top: 16px; left: 16px; width: 20px; height: 20px; accent-color: var(--color-action); }
.site-page .outfit-card > a { margin: 0 24px 24px; }
.site-page .outfit-placeholder { display: grid; place-items: center; aspect-ratio: 1 / 1; background: var(--color-surface-muted); color: var(--color-text-secondary); font-size: 14px; }
.site-page .outfit-card img { width: 100%; height:auto; aspect-ratio: 1 / 1; object-fit: contain; }
.site-page .outfit-copy { display: grid; gap: 8px; padding: 24px; }
.site-page .outfit-copy strong { font-size: 22px; line-height: 28px; }
.site-page .outfit-copy > span:last-child,.site-page .skill-description { color: var(--color-text-secondary); font-size: 14px; line-height: 22px; }
.site-page .skill-description { display: block; margin-top: 8px; }
.site-page .usage-recap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px; padding-block: 24px; border-top: 1px solid var(--color-border-subtle); }
.site-page .usage-recap p { max-width: 65ch; }
.site-page [data-offer-duration] { margin-top: 24px; max-width: 420px; }
@media (min-width: 640px) { .site-page .outfit-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (min-width: 1024px) { .site-page .outfit-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } }
.site-page .page-custom-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
.site-page .page-custom-card { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; padding: 24px; border: 1px solid var(--color-border-subtle); border-radius: var(--radius-card); background: var(--color-surface); min-width: 0; }
.site-page .page-custom-card > p { color: var(--color-text-secondary); }
.site-page .page-custom-card > a { margin-top: auto; }
.site-page .page-custom-grid + .section-note { margin-top: 24px; color: var(--color-text-secondary); font-size: 14px; line-height: 22px; }
.site-page .embedded-customization { margin-top: 64px; }
@media (min-width: 768px) {
  .site-page .page-custom-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .site-page .page-custom-card { padding: 32px; }
}
.site-page .needs-dropdown > details { border-top: 1px solid var(--color-border-control); }
.site-page .needs-dropdown > details > summary { position: relative; list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 48px; padding: 12px 28px 12px 0; cursor: pointer; font-weight: 500; }
.site-page .needs-dropdown > details > summary::before,
.site-page .needs-dropdown > details > summary::after { content: ''; position: absolute; right: 2px; top: 50%; width: 12px; height: 1.5px; background: currentColor; }
.site-page .needs-dropdown > details > summary::before { transform: rotate(90deg); }
.site-page .needs-dropdown > details[open] > summary::before { transform: rotate(0deg); }
.site-page .need-description { padding: 0 0 16px; font-size: 14px; line-height: 22px; color: var(--color-text-muted-on-dark); }
.site-page .need-description p { margin-bottom: 8px; }
.site-page .need-description a { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; color: var(--color-text-on-dark); text-decoration: underline; font-weight: 500; }
.site-page .nav-links.is-open { max-height: calc(100svh - var(--page-nav-height) - env(safe-area-inset-bottom)); overflow-y: auto; overscroll-behavior: contain; padding-bottom: max(20px, env(safe-area-inset-bottom)); }

/* Product-led opening: a clear title and an original full-height robot. */
.site-page .page-hero { padding-block: 48px 56px; }
.site-page .split-hero { display: grid; gap: 32px; align-items: center; }
.site-page .hero-copy > :is(.lead, .eyeline) { margin-top: 24px; }
.site-page .hero-copy h1 { max-width: 13ch; }
.site-page .hero-art { position: relative; width: 100%; height:auto; aspect-ratio:1 / 1; overflow: clip; display: grid; place-items: center; }
.site-page .hero-art img { display: block; width: 100%; max-width: 100%; height: 100%; object-fit: contain; object-position: center; }
.site-page .hero-art figcaption { position: absolute; bottom: 0; inset-inline: 0; text-align: center; font-size: 12px; color: var(--color-text-secondary); }
.site-page .hero-art figure { margin: 0; width: 100%; height: 100%; }

/* Buying and renting share product facts, not a simulated checkout. */
.site-page .product-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
.site-page .product-card { display: flex; flex-direction: column; min-width: 0; overflow: clip; background: var(--color-surface); border: 1px solid var(--color-border-subtle); border-radius: var(--radius-card); }
.site-page .product-media { min-height:0; height:auto; aspect-ratio:1 / 1; background: var(--color-surface-muted); display: grid; grid-template-rows: minmax(0, 1fr); place-items: center; overflow: clip; }
.site-page .product-media img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; min-height: 0; object-fit: contain; }
.site-page .product-copy { display: flex; flex-direction: column; flex-grow: 1; padding: 24px; }
.site-page .product-model { color: var(--color-text-secondary); font-size: 14px; line-height: 22px; margin-top: 8px; }
.site-page .product-copy > p:not(.product-model) { color: var(--color-text-secondary); margin-top: 16px; max-width: 55ch; }
.site-page .product-copy .actions { padding-top: 24px; margin-top: auto; }
.site-page .product-copy ul { padding-left: 20px; margin: 20px 0 0; display: grid; gap: 8px; color: var(--color-text-secondary); }
.site-page .media-pending { width: 100%; min-height: 280px; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 16px; padding: 32px 24px; text-align: center; color: var(--color-text-secondary); background: var(--color-surface-muted); }
.site-page .media-pending strong { color: var(--color-text-primary); font-size: clamp(40px, 7vw, 64px); font-weight: 600; letter-spacing: -.03em; line-height: 1.1; }
.site-page .media-pending p { max-width: 32ch; font-size: 14px; line-height: 22px; }
.site-page .media-pending .icon { width: 32px; height: 32px; }

/* Four distinct event intents remain discoverable without another generic grid. */
.site-page .needs-grid { display: grid; gap: 0; border-top: 1px solid var(--color-border-subtle); }
.site-page .need-card { display: flex; flex-direction: column; min-width: 0; gap: 12px; padding: 24px 0; border-bottom: 1px solid var(--color-border-subtle); }
.site-page .need-label { display: flex; align-items: center; justify-content: space-between; gap: 16px; font-size: 14px; line-height: 22px; font-weight: 400; color: var(--color-text-secondary); }
.site-page .need-label .icon { flex-shrink: 0; color: var(--color-action); }
.site-page .need-card h3 { font-size: 24px; line-height: 30px; }
.site-page .need-card p { max-width: 48ch; color: var(--color-text-secondary); }
.site-page .need-card .text-link { width: fit-content; }
.site-page .need-index { display: none; }
.site-page .need-card > .icon { width: 24px; height: 24px; color: var(--color-action); }

.site-page .dark-band { background: var(--color-graphite); color: var(--color-text-on-dark); }
.site-page .band-layout { display: grid; gap: 24px; align-items: center; }
.site-page .band-layout h2 { max-width: 23ch; }
.site-page .band-layout p { max-width: 46ch; color: var(--color-text-muted-on-dark); margin-top: 16px; }
.site-page .band-layout > .button { width: fit-content; max-width: 100%; justify-self: start; }
.site-page .dark-band .button-secondary { color: var(--color-text-on-dark); border-color: var(--color-text-muted-on-dark); }
.site-page .dark-band :focus-visible { outline-color: var(--color-text-on-dark); }

/* Personalization is a scoped conversation, with readable possibilities. */
.site-page .custom-panel { display: grid; gap: 32px; }
.site-page .custom-panel > .section-top { grid-column: 1 / -1; margin: 0; }
.site-page .custom-panel > .section-top .button { width: fit-content; max-width: 100%; justify-self: start; }
.site-page .custom-panel > .section-note { grid-column: 1 / -1; max-width: 65ch; font-size: 14px; line-height: 22px; color: var(--color-text-secondary); }
.site-page .custom-panel > :is(h2, div) > p { max-width: 45ch; margin-top: 16px; color: var(--color-text-secondary); }
.site-page .custom-preview { display: grid; gap: 24px; }
.site-page .custom-preview h2 { max-width: 24ch; }
.site-page .custom-preview .lead { max-width: 48ch; }
.site-page .custom-preview .button { margin-top: 24px; }
.site-page .custom-grid { display: grid; gap: 24px; }
.site-page .custom-tile { padding-top: 24px; border-top: 1px solid var(--color-border-subtle); }
.site-page .custom-icon { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 16px; color: var(--color-text-primary); }
.site-page .custom-icon svg { width: 24px; height: 24px; }
.site-page .custom-tile h3 { margin-bottom: 12px; }
.site-page .custom-tile p { max-width: 42ch; color: var(--color-text-secondary); }
.site-page .custom-tile .text-link { margin-top: 16px; }

/* Event pages use either the verified Booster image or an explicit media gap. */
.site-page .event-hero { padding-block: 32px 56px; }
.site-page .event-layout { display: grid; align-items: center; gap: 32px; }
.site-page .event-layout h1 { max-width: 17ch; }
.site-page .event-layout .lead { margin-top: 24px; }

.site-page .event-layout > .media-pending { min-height: 320px; border-radius: var(--radius-card); }
.site-page .event-highlights { display: grid; gap: 0; padding: 0; list-style: none; margin: 32px 0 0; }
.site-page .event-highlights > :is(li, div) { display: flex; align-items: flex-start; gap: 12px; padding: 20px 0; border-top: 1px solid var(--color-border-subtle); }
.site-page .event-highlights .icon { margin-top: 3px; color: var(--color-action); }
.site-page .event-highlights p { max-width: 50ch; color: var(--color-text-secondary); }
.site-page .event-highlights strong { display: block; color: var(--color-text-primary); margin-bottom: 4px; }

/* A project summary accompanies the actual email-request form. */
.site-page .project-layout { display: grid; gap: 32px; align-items: start; }
.site-page .project-aside > p { max-width: 46ch; margin-top: 20px; color: var(--color-text-secondary); }
.site-page .project-summary { padding: 24px; border: 1px solid var(--color-border-subtle); border-radius: 16px; background: var(--color-surface); margin-top: 32px; }
.site-page .project-summary h3 { font-size: 20px; line-height: 26px; margin-bottom: 16px; }
.site-page .project-summary h2 { font-size: 24px; line-height: 30px; margin-bottom: 16px; }
.site-page .project-layout .booking-form > h2 { font-size: 24px; line-height: 30px; margin-bottom: 24px; }
.site-page .project-summary > p { color: var(--color-text-secondary); font-size: 14px; margin-top: 12px; }
.site-page .project-summary dl { margin: 0; display: grid; gap: 16px; }
.site-page .project-summary dt { font-size: 14px; color: var(--color-text-secondary); }
.site-page .project-summary dd { margin: 4px 0 0; font-weight: 500; overflow-wrap: anywhere; }
.site-page .project-summary ul { margin: 0; padding-left: 20px; display: grid; gap: 8px; }
.site-page .project-aside .contact-block { margin-top: 32px; }
.site-page .choice-checks { display: grid; gap: 12px; margin: 12px 0 24px; }
.site-page .choice-checks label { display: flex; align-items: flex-start; gap: 12px; min-height: 48px; padding: 12px; border: 1px solid var(--color-border-control); border-radius: 12px; cursor: pointer; }
.site-page .choice-checks input { flex-shrink: 0; width: 18px; height: 18px; margin: 3px 0 0; accent-color: var(--color-action); }
.site-page .choice-checks label:has(input:checked) { border-color: var(--color-action); background: var(--color-action-soft); }
.site-page .choice-checks label:has(input:focus-visible) { outline: 3px solid var(--color-action); outline-offset: 3px; }
.site-page .form-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.site-page .form-actions .button { flex: 1; justify-content: space-between; }
.site-page .project-layout form { min-width: 0; }
.site-page .project-layout fieldset:not(.form-group):not(.package-fieldset) { min-width: 0; padding: 0; border: 0; margin: 0 0 24px; }
.site-page .project-layout fieldset > legend { font-weight: 600; }

.site-page .footer-top:has(.footer-col) { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: 32px; }
.site-page .footer-col { display: grid; align-content: start; gap: 8px; min-width: 0; }
.site-page .footer-col h3 { font-size: 16px; line-height: 24px; margin-bottom: 4px; }
.site-page .footer-col a { color: var(--color-text-muted-on-dark); width: fit-content; max-width: 100%; overflow-wrap: anywhere; }
.site-page .footer-col p { font-size: 14px; max-width: 32ch; }

@media (min-width: 640px) {
  .site-page .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .site-page .needs-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px; }
  .site-page .need-card { padding-block: 32px; }
  .site-page .choice-checks { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .site-page .custom-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .site-page .footer-top:has(.footer-col) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 768px) {
  .site-page { --page-nav-height: 72px; }
  .site-page .needs-menu { position: relative; }
  .site-page .needs-menu > summary { gap: 10px; }
  .site-page .needs-dropdown { position: absolute; top: calc(100% + 14px); right: 0; width: 420px; max-width: calc(100vw - 64px); max-height: calc(100svh - 112px); overflow-y: auto; overscroll-behavior: contain; padding: 12px 24px; background: var(--color-surface); color: var(--color-text-primary); border: 1px solid var(--color-border-subtle); border-radius: 16px; box-shadow: 0 12px 32px color-mix(in srgb, var(--color-graphite) 12%, transparent); }
  .site-page .needs-dropdown > details:first-child { border-top: 0; }
  .site-page .needs-dropdown > details { border-color: var(--color-border-subtle); }
  .site-page .need-description { color: var(--color-text-secondary); }
  .site-page .need-description a { color: var(--color-action); }
  .site-page .needs-dropdown :focus-visible { outline-color: var(--color-action); }
  .site-page .nav-links.is-open { overflow: visible; max-height: none; padding-bottom: 0; }
  .site-page .page-hero { padding-block: 64px 72px; }
  .site-page .page-main h1 { font-size: clamp(48px, 5vw, 64px); line-height: 1.065; }
  .site-page .lead { font-size: 20px; line-height: 30px; }
  .site-page .split-hero { grid-template-columns: 1.15fr 1fr; gap: 32px; }

  .site-page .section-top { grid-template-columns: 1.1fr 1fr; align-items: end; gap: 32px; margin-bottom: 40px; }
  .site-page .section-top > p { justify-self: end; }
  .site-page .band-layout { grid-template-columns: 1.3fr 1fr; gap: 48px; }
  .site-page .band-layout > .actions { margin: 0; justify-content: flex-end; }
  .site-page .band-layout > .button { justify-self: end; }
  .site-page .custom-panel > .section-top { grid-template-columns: minmax(0, 1fr) auto; }
  .site-page .custom-panel > .section-top .button { justify-self: end; }
  .site-page .custom-preview { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; align-items: start; }
  .site-page .event-hero { padding-block: 40px 72px; }
  .site-page .event-layout { grid-template-columns: 1.1fr 1fr; gap: 48px; }

  .site-page .event-layout > .media-pending { min-height: 480px; }
  .site-page .product-copy { padding: 32px; }
}

@media (min-width: 1024px) {
  .site-page .page-hero { padding-block: 64px 80px; }
  .site-page .split-hero { grid-template-columns: 1.1fr 1fr; gap: 64px; min-height: 600px; }

  .site-page .page-main h1 { font-size: 64px; line-height: 68px; }

  .site-page .custom-panel { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .site-page .custom-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
  .site-page .custom-grid.appearance-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .site-page .custom-preview { gap: 64px; }
  .site-page .project-layout { grid-template-columns: 5fr 7fr; gap: 64px; }
  .site-page .project-aside { position: sticky; top: 104px; }
  .site-page .event-hero { padding-bottom: 96px; }
  .site-page .event-layout { gap: 64px; }

  .site-page .footer-top:has(.footer-col) { grid-template-columns: 1.4fr 1fr 1fr; gap: 48px; }
}

@media (max-width: 767px) {
  .site-page .nav-links:not(.is-open) .needs-dropdown { display: none; }
  .site-page .nav-links > a, .site-page .needs-menu > summary { font-size: 16px; line-height: 24px; }
  .site-page .needs-dropdown { padding-left: 16px; }
  .site-page .project-aside { position: static; }
}

@media (max-width: 359px) {
  .site-page .page-main h1 { font-size: 36px; line-height: 40px; }
  .site-page .actions { align-items: stretch; }
  .site-page .actions .button { width: 100%; justify-content: space-between; padding-inline: 20px; }

  .site-page .product-copy { padding: 20px; }

  .site-page .project-summary { padding: 20px; }
}

@media (hover: hover) {
  .site-page .needs-menu > summary:hover { color: var(--color-text-muted-on-dark); }
  .site-page .needs-dropdown > details > summary:hover { text-decoration: underline; }
  .site-page .need-card a:hover .icon { transform: translate(2px, -2px); }
  .site-page .dark-band .button-secondary:hover { background: var(--color-surface); color: var(--color-text-primary); }
  .site-page .product-card:has(a:hover) { border-color: var(--color-border-control); }
  .site-page .breadcrumb a:hover { color: var(--color-text-primary); }
}

@media (prefers-reduced-motion: no-preference) {
  .site-page .product-card, .site-page .choice-checks label { transition: border-color 180ms, background 180ms; }
  .site-page .needs-menu > summary::after { transition: transform 180ms var(--ease-out); }
  .site-page .need-card .icon { transition: transform 180ms var(--ease-out); }
}

@media (forced-colors: active) {
  .site-page .choice-checks label, .site-page .needs-dropdown, .site-page .product-card { border: 1px solid CanvasText; }
}

/* The home page leads with the brand statement; imagery awaits actual media. */
.site-page .home-intro { display: grid; align-items: center; min-height: max(420px, calc(80svh - var(--page-nav-height))); padding-block: 72px; background: var(--color-background); }
.site-page .home-intro .hero-copy { width: 100%; max-width: 880px; margin-inline: auto; text-align: center; }
.site-page .home-intro h1 { max-width: 16ch; margin-inline: auto; }
.site-page .home-intro .lead { max-width: 42ch; margin: 24px auto 0; }
.site-page .intro-links { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 12px 28px; margin-top: 32px; }
.site-page .intro-links a { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 44px; color: var(--color-action); font-weight: 500; text-decoration: underline; }
.site-page .home-statement { max-width: 700px; }
.site-page .home-statement h2 { max-width: 24ch; }
.site-page .home-statement p { max-width: 65ch; color: var(--color-text-secondary); font-size: 18px; line-height: 28px; margin-top: 24px; text-wrap: pretty; }
.site-page .media-carousel { min-width: 0; }
.site-page .carousel-heading { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 32px; }
.site-page .carousel-heading h2 { max-width: 24ch; }
.site-page .carousel-heading p { max-width: 48ch; margin-top: 16px; color: var(--color-text-secondary); }
.site-page .carousel-pause { min-height: 44px; padding: 8px 20px; border: 1px solid var(--color-border-control); border-radius: 999px; background: var(--color-surface); color: var(--color-text-secondary); font-size: 14px; }
.site-page .carousel-track { display: grid; grid-template-columns: minmax(0, 1fr); align-items: stretch; gap: 24px; max-width: 100%; min-width: 0; padding: 4px 4px 20px; scrollbar-width: none; }
.site-page .carousel-track::-webkit-scrollbar { display: none; }
.site-page .is-animated .carousel-track { display: flex; overflow-x: auto; overscroll-behavior-x: contain; scroll-behavior: auto; scroll-snap-type: none; }
.site-page .carousel-slide { flex: 0 0 85%; min-width: 0; }
.site-page .gallery-image { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 20px; }
.site-page .gallery-caption audio { width: 100%; margin-top: 16px; }
.site-page .service-card-link { display: block; height: 100%; border-radius: 20px; }
.site-page .service-card-link h3 { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.site-page .service-card-link .icon { color: var(--color-action); }
.site-page .gallery-placeholder { aspect-ratio: 1 / 1; width: 100%; padding: 24px; background: var(--color-surface-muted); border: 1px solid var(--color-border-subtle); border-radius: 20px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; text-align: center; }
.site-page .gallery-placeholder strong { color: var(--color-text-primary); font-size: clamp(36px, 5vw, 64px); font-weight: 600; letter-spacing: -.03em; line-height: 1.1; }
.site-page [data-carousel="services"] .gallery-placeholder strong { font-size: clamp(28px, 3vw, 40px); text-wrap: balance; }
.site-page .gallery-placeholder p,
.site-page .gallery-placeholder span { max-width: 32ch; color: var(--color-text-secondary); font-size: 14px; line-height: 22px; }
.site-page .gallery-placeholder .icon { width: 32px; height: 32px; color: var(--color-text-secondary); }
.site-page .gallery-caption { padding: 20px 4px 0; }
.site-page .gallery-caption h3 { font-size: 22px; line-height: 28px; }
.site-page .gallery-caption p { margin-top: 8px; max-width: 50ch; color: var(--color-text-secondary); }
.site-page .audio-placeholder { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 16px 0; margin-top: 16px; border-top: 1px solid var(--color-border-subtle); color: var(--color-text-secondary); font-size: 14px; line-height: 22px; }
.site-page .audio-placeholder .icon { width: 20px; height: 20px; }
.site-page .gateway-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.site-page .gateway { display: flex; flex-direction: column; gap: 16px; min-width: 0; min-height: 160px; padding: 24px 20px; border: 1px solid var(--color-border-control); border-radius: 20px; background: var(--color-surface); color: var(--color-text-primary); }
.site-page .gateway h3,
.site-page .gateway > strong { font-size: 22px; line-height: 28px; font-weight: 600; letter-spacing: -.03em; }
.site-page .gateway p,
.site-page .gateway > span { color: var(--color-text-secondary); font-size: 14px; line-height: 22px; }
.site-page .gateway > .icon { margin-top: auto; align-self: flex-end; color: var(--color-action); }

@media (min-width: 768px) {
  .site-page .home-intro { padding-block: 96px; }
  .site-page .home-statement p { font-size: 20px; line-height: 30px; }
  .site-page .carousel-slide { flex-basis: calc((100% - 24px) / 2); }
  .site-page .carousel-track { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .site-page .gallery-placeholder { padding: 32px; }
}
@media (min-width: 1024px) {
  .site-page .carousel-slide { flex-basis: calc((100% - 48px) / 3); }
  .site-page .carousel-track { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .site-page .gateway-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
  .site-page .gateway { padding: 32px 24px; min-height: 200px; }
}
@media (max-width: 767px) {
  .site-page .gateway { padding: 24px 16px; }
  .site-page .gateway > strong { font-size: 18px; line-height: 24px; overflow-wrap: normal; }
}
@media (max-width: 359px) {
  .site-page .gateway-grid { grid-template-columns: minmax(0, 1fr); }
  .site-page .gateway { min-height: 120px; }
  .site-page .home-intro { padding-block: 56px; }
  .site-page .gallery-placeholder { padding: 20px 16px; }
}
@media (hover: hover) {
  .site-page .intro-links a:hover { color: var(--color-action-hover); }
  .site-page .carousel-pause:hover { background: var(--color-graphite); color: var(--color-text-on-dark); }
  .site-page .gateway:hover { border-color: var(--color-action); background: var(--color-action-soft); }
}
@media (prefers-reduced-motion: no-preference) {
  .site-page .carousel-pause,
  .site-page .gateway { transition: background 180ms, border-color 180ms, color 180ms; }
}
@media (forced-colors: active) {
  .site-page .gateway, .site-page .carousel-pause, .site-page .gallery-placeholder { border: 1px solid CanvasText; }
}

/* Parcours par besoin : mêmes tokens, mêmes surfaces, deux portes d’entrée. */
.site-page .need-gateways { display:grid; grid-template-columns:minmax(0,1fr); gap:24px; margin-top:48px; }
.site-page .need-gateways article { background:var(--color-surface); border:1px solid var(--color-border-subtle); border-radius:24px; padding:32px; display:flex; flex-direction:column; align-items:flex-start; gap:20px; min-width:0; }
.site-page .need-gateways h3 { font-size:clamp(26px,3vw,40px); line-height:1.15; letter-spacing:-.03em; }
.site-page .need-gateways p { max-width:48ch; color:var(--color-text-secondary); }
.site-page .need-gateways .button { margin-top:auto; }
.site-page .mission-tasks { list-style:none; margin:24px 0; padding:0; }
.site-page .mission-tasks li { padding:10px 0 10px 24px; position:relative; line-height:1.5; color:var(--color-text-primary); }
.site-page .mission-tasks li::before { content:'✓'; position:absolute; left:0; color:var(--color-action); font-weight:600; }
.site-page #sur-mesure .mission-tasks li::before { content:'→'; }
.site-page .mission-overview { display:grid; gap:32px; }
.site-page .large-tasks { margin-top:0; font-size:20px; }
.site-page .capability-note { color:var(--color-text-secondary); padding-top:24px; border-top:1px solid var(--color-border-subtle); line-height:1.65; }
.site-page .mission-card { display:flex; flex-direction:column; align-items:flex-start; }
.site-page .mission-card .usage-next { margin-top:auto; }
.site-page .usage-form .mode-options { display:grid; grid-template-columns:minmax(0,1fr); }
.site-page .usage-form .field { max-width:760px; margin-block:24px; }
.site-page .booking-form fieldset { min-width:0; }
.site-page #project-summary { overflow-wrap:anywhere; }
.site-page .project-summary { max-height:42vh; overflow:auto; }
.site-page .booking-form .form-group + .form-group { margin-top:40px; }
.site-page .booking-form #task-options:empty { display:none; }
@media(min-width:768px) { .site-page .need-gateways { grid-template-columns:repeat(2,minmax(0,1fr)); } .site-page .mission-overview { grid-template-columns:1fr 1fr; gap:64px; } .site-page .usage-form .mode-options { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:767px) { .site-page .need-gateways article { padding:24px; } .site-page .project-summary { max-height:none; } }
.site-page .usage-form legend, .site-page .booking-form legend { float:none; max-width:100%; }

/* Deux rubriques commerciales ; leurs liens utilisent le même catalogue que les pages. */
.site-page .nav-column { display:flex; flex-direction:column; min-width:0; }
.site-page .nav-column > a { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:44px; padding:10px 0; line-height:1.4; color:inherit; border-bottom:1px solid var(--color-border-control); }
.site-page .nav-column > a:hover { text-decoration:underline; }
.site-page .nav-section-title { font-size:13px; line-height:20px; font-weight:600; padding:18px 0 8px; }
.site-page .nav-caption { font-size:13px; line-height:20px; padding-top:12px; }
.site-page .nav-column .nav-create { margin-top:16px; font-weight:600; }
.site-page .gateway-pair { grid-template-columns:repeat(2,minmax(0,1fr)); }
.site-page .purchase-details { padding:24px; background:var(--color-background); border-radius:20px; }
@media(min-width:768px) {
 .site-page .nav-catalogue { position:fixed; inset:76px auto auto 50%; transform:translateX(-50%); width:800px; max-width:calc(100vw - 64px); display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; padding:16px 32px 28px; }
 .site-page .nav-section-title, .site-page .nav-caption { color:var(--color-text-secondary); }
 .site-page .nav-column > a { border-color:var(--color-border-subtle); }
 .site-page .nav-column .nav-create { color:var(--color-action); }
}
@media(max-width:767px) { .site-page .nav-catalogue { gap:16px; padding-bottom:16px; } .site-page .purchase-details { padding:16px; } }
@media(max-width:359px) { .site-page .gateway-pair { grid-template-columns:minmax(0,1fr); } }

.site-page .skills-glossary { display:grid; gap:24px; margin:0; }
.site-page .skills-glossary > div { padding:24px 0; border-top:1px solid var(--color-border-subtle); }
.site-page .skills-glossary dt { font-size:22px; font-weight:600; line-height:1.3; margin-bottom:16px; }
.site-page .skills-glossary dd { margin:0; color:var(--color-text-secondary); max-width:55ch; }
@media(min-width:1024px) {
 .site-page .skills-glossary { grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; }
}

.site-page [data-carousel="missions"] .gallery-placeholder strong { font-size:clamp(28px,3vw,40px); text-wrap:balance; }

/* Même grille et mêmes repères d’alignement pour les quatre aperçus. */
.site-page .media-carousel .gallery-placeholder strong { font-size:clamp(28px,3vw,40px); }
.site-page .media-carousel .carousel-slide { display:flex; flex-direction:column; }
.site-page .media-carousel .service-card-link { display:flex; flex-direction:column; height:auto; flex:1; }
.site-page .media-carousel .gallery-caption { flex:1; }
.site-page .media-carousel .gallery-caption h3 { align-items:flex-start; }
.site-page .media-carousel .gallery-note { display:block; margin-top:12px; color:var(--color-text-secondary); font-size:14px; line-height:22px; }
.site-page .media-carousel .carousel-slide > audio { width:100%; margin-top:16px; }
@media(min-width:768px) { .site-page .media-carousel .gallery-caption h3 { min-height:56px; } }
@media(min-width:1024px) { .site-page .media-carousel .gallery-caption p { min-height:78px; } }

/* Un fichier photo carré 2000 × 2000 pour chaque usage et chaque écran. */
.site-page .product-media .media-pending, .site-page .hero-art .media-pending { min-height:0; width:100%; height:100%; }

/* Cartes de choix : un seul format photo, mêmes repères sur tous les écrans. */
.site-page .option-intro { padding-top:40px; display:grid; gap:16px; }
.site-page .option-intro label { font-weight:600; }
.site-page .option-intro select { width:100%; max-width:440px; min-height:48px; padding:12px 16px; border:1px solid var(--color-border-control); border-radius:12px; background:var(--color-surface); color:var(--color-text-primary); font:inherit; }
.site-page .option-intro p { max-width:72ch; color:var(--color-text-secondary); }
.site-page .option-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:24px; }
.site-page .option-card { min-width:0; display:flex; flex-direction:column; background:var(--color-surface); border:1px solid var(--color-border-subtle); border-radius:20px; overflow:hidden; }
.site-page .option-card label { position:relative; display:flex; flex-direction:column; flex:1; cursor:pointer; }
.site-page .option-card input { position:absolute; top:20px; right:20px; width:24px; height:24px; accent-color:var(--color-action); z-index:1; }
.site-page .option-card:has(input:checked) { border-color:var(--color-action); box-shadow:0 0 0 1px var(--color-action); }
.site-page .option-card:has(input:focus-visible) { outline:3px solid var(--color-action); outline-offset:5px; }
.site-page .option-visual { display:block; aspect-ratio:1; width:100%; min-height:0; flex-shrink:0; background:var(--color-surface-muted); }
.site-page .option-visual img { display:block; width:100%; height:100%; object-fit:contain; }
.site-page .option-placeholder { height:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:20px; padding:24px; text-align:center; }
.site-page .option-placeholder strong { font-size:clamp(26px,3vw,38px); line-height:1.15; letter-spacing:-.03em; text-wrap:balance; }
.site-page .option-placeholder > span { color:var(--color-text-secondary); font-size:14px; }
.site-page .option-copy { display:flex; flex-direction:column; gap:16px; padding:24px; flex:1; }
.site-page .option-copy > strong { font-size:22px; line-height:1.3; }
.site-page .option-copy > span:not(.option-select) { color:var(--color-text-secondary); }
.site-page .option-copy .option-status { margin-top:auto; font-size:13px; }
.site-page .option-select { display:flex; align-items:center; gap:8px; color:var(--color-action); font-weight:600; min-height:28px; }
.site-page .option-select > [aria-hidden], .site-page .option-on { display:none; }
.site-page input:checked ~ .option-copy .option-off { display:none; }
.site-page input:checked ~ .option-copy .option-on, .site-page input:checked ~ .option-copy .option-select > [aria-hidden] { display:inline; }
.site-page .option-audio-note { margin:0 24px 24px; color:var(--color-text-secondary); font-size:14px; }
.site-page .option-card audio { max-width:calc(100% - 48px); margin:0 24px 24px; }
.site-page .option-review { display:grid; gap:24px; }
.site-page .option-review p { margin-top:20px; max-width:75ch; }
.site-page .footer-bottom address { font-style:normal; flex-basis:100%; }
@media(min-width:768px) { .site-page .option-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } .site-page .option-copy > strong { min-height:58px; } }
@media(forced-colors:active) { .site-page .option-card:has(input:checked) { outline:2px solid Highlight; } }

/* Un menu vertical, dans le même ordre sur mobile et ordinateur. */
.site-page .nav-catalogue { grid-template-columns:minmax(0,1fr); gap:0; }
@media(min-width:768px) { .site-page .nav-catalogue { width:400px; max-height:calc(100dvh - 100px); overflow-y:auto; } }
.site-page .contact-floating { position:fixed; z-index:40; right:max(20px,env(safe-area-inset-right)); bottom:calc(20px + env(safe-area-inset-bottom)); display:flex; align-items:center; gap:12px; padding:6px 18px 6px 6px; background:var(--color-surface); color:var(--color-text-primary); border:1px solid var(--color-border-subtle); border-radius:999px; box-shadow:0 6px 24px color-mix(in srgb,var(--color-graphite) 10%,transparent); text-decoration:none; font-size:15px; font-weight:600; line-height:24px; }
.site-page .contact-floating img { width:48px; height:48px; object-fit:contain; flex-shrink:0; }
.site-page .contact-floating:hover { border-color:var(--color-action); color:var(--color-action); }
.site-page .contact-floating:focus-visible { outline:3px solid var(--color-action); outline-offset:4px; }
.site-page:has(.needs-menu[open]) .contact-floating, .site-page:has(.nav-links.is-open) .contact-floating { visibility:hidden; }
.site-page .footer { padding-bottom:112px; }
.site-page .footer-directory { display:grid; grid-template-columns:minmax(0,1fr); gap:32px; padding-block:32px; border-top:1px solid var(--color-border-control); }
.site-page .footer-directory h2 { font-size:17px; line-height:1.5; color:var(--color-text-on-dark); margin-bottom:12px; }
.site-page .footer-directory p { color:var(--color-text-muted-on-dark); font-size:14px; line-height:1.7; max-width:48ch; }
.site-page .footer-directory a { display:flex; align-items:center; width:fit-content; min-height:44px; color:var(--color-text-muted-on-dark); font-size:14px; text-decoration:none; }
.site-page .footer-directory a:hover { text-decoration:underline; color:var(--color-text-on-dark); }
.site-page .home-category { margin-bottom:24px; max-width:none; }
.site-page .h1-model { font-size:.5em; line-height:1.3; display:inline-block; margin-top:16px; }
.site-page.party-page .hero-content > .eyeline { color:var(--color-text-on-dark); margin-inline:auto; }
.site-page :is(input,textarea,select,button) { scroll-margin-bottom:112px; }
@media(min-width:768px) { .site-page .footer-directory { grid-template-columns:1.3fr 1fr 1fr; gap:40px; } }
@media(max-width:767px) { .site-page .contact-floating { right:16px; bottom:calc(16px + env(safe-area-inset-bottom)); } }

/* Finition commune : rôles typographiques et lignes de grille partagés. */
.site-page { --type-card:22px; --line-card:28px; --grid-gap:16px; }
.site-page :is(.need-card h3,.outfit-copy strong,.option-copy > strong,.gallery-caption h3,.page-custom-card h3) { font-size:var(--type-card); line-height:var(--line-card); font-weight:600; letter-spacing:-.03em; }
.site-page .option-placeholder strong { font-weight:600; }
.site-page .usage-form { max-width:none; margin-inline:0; }
.site-page :is(.usage-form,.booking-form) .form-group > legend { font-size:var(--type-card); line-height:var(--line-card); font-weight:600; margin-bottom:24px; }
.site-page .usage-form .form-group { padding-top:24px; }
.site-page .breadcrumb { min-height:44px; align-items:center; }
.site-page .outfit-card, .site-page .option-card, .site-page .gallery-image, .site-page .gallery-placeholder { border-radius:var(--radius-card); }
.site-page .outfit-card > a { margin-top:auto; }
.site-page .mission-card .need-label { width:100%; }
.site-page :is(.needs-grid,.outfit-grid,.option-grid,.custom-grid,.product-grid) { column-gap:var(--grid-gap); }
.site-page .actions { margin-top:24px; }
.site-page .custom-preview .actions .button { margin-top:0; }
.site-page .footer-bottom > span:nth-child(2) { display:inline; }
.site-page:has(form :is(input,select,textarea):focus) .contact-floating { visibility:hidden; }
/* Reserve the fixed contact action's lane below the hero controls. */
.party-page .hero { min-height:680px; }
.party-page .hero-content { padding-bottom:220px; }
.party-page .hero-bottom { bottom:calc(100px + env(safe-area-inset-bottom)); flex-wrap:wrap; }
@media(max-height:700px) {
  .party-page.hero-in-view .contact-floating { visibility:hidden; }
}
@media(max-width:767px) {
  .party-page .video-note { position:static; flex-basis:100%; text-align:center; }
}
.site-page .form-error-summary { padding:20px; margin-bottom:24px; border:1px solid var(--color-error); border-radius:12px; color:var(--color-error); background:var(--color-surface); }
.site-page .form-error-summary h2 { font-size:20px; line-height:26px; margin:0 0 8px; }
.site-page .form-error-summary ul { margin:0; padding-left:20px; }
.site-page .form-error-summary a { display:inline-flex; align-items:center; min-height:44px; text-decoration:underline; }
@media(min-width:768px) { .site-page { --grid-gap:20px; } }
@media(min-width:1024px) { .site-page { --type-card:24px; --line-card:30px; --grid-gap:24px; } }
/* Les textes longs dimensionnent une ligne partagée, sans hauteur forcée ni texte coupé. */
@supports(grid-template-rows:subgrid) {
 @media(min-width:640px) {
  .site-page .needs-grid > .need-card { display:grid; grid-template-rows:subgrid; grid-row:span 3; align-items:start; }
  .site-page .needs-grid > .mission-card { grid-row:span 5; }
  .site-page .outfit-grid > [data-gallery-robot] { display:grid; grid-template-rows:subgrid; grid-row:span 5; }
  .site-page [data-gallery-robot] > .outfit-card { display:grid; grid-template-rows:subgrid; grid-row:1 / -1; row-gap:0; }
  .site-page .outfit-grid > .outfit-card { display:grid; grid-template-rows:subgrid; grid-row:span 4; row-gap:0; }
  .site-page .outfit-copy { grid-row:span 3; grid-template-rows:subgrid; row-gap:8px; }
 }
}

/* Need-first journey: shared optional choices and contextual galleries. */
.site-page .project-options { min-width:0; margin-block:20px; border:1px solid var(--color-border-control); border-radius:16px; background:var(--color-surface); }
.site-page .project-options > summary { display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; min-height:56px; padding:16px 20px; cursor:pointer; font-weight:600; list-style:none; }
.site-page .project-options > summary::-webkit-details-marker { display:none; }
.site-page .project-options > summary::after { content:'+'; margin-left:auto; font-size:24px; font-weight:400; }
.site-page .project-options[open] > summary::after { content:'−'; }
.site-page .project-options .optional,.site-page .choice-count { font-size:14px; font-weight:400; color:var(--color-text-secondary); }
.site-page .project-options-body { display:grid; gap:24px; padding:4px 20px 24px; }
.site-page .project-options-body > div { min-width:0; }
.site-page .project-options-body h3 { font-size:22px; line-height:28px; margin-bottom:12px; }
.site-page .project-options-body .outfit-grid { margin-block:8px; }
.site-page .project-choice-grid { display:grid; gap:12px; margin-top:16px; }
.site-page .project-option { display:flex; align-items:flex-start; gap:12px; padding:16px; border:1px solid var(--color-border-control); border-radius:12px; cursor:pointer; min-width:0; }
.site-page .project-option input { margin-top:4px; width:20px; height:20px; flex-shrink:0; accent-color:var(--color-action); }
.site-page .project-option > span { display:grid; gap:8px; min-width:0; }
.site-page .project-option strong { font-weight:600; }
.site-page .project-option span span { color:var(--color-text-secondary); font-size:14px; line-height:22px; }
.site-page .project-option:has(:checked) { background:var(--color-action-soft); border-color:var(--color-action); }
.site-page .recommendation,.site-page .recommendation-label { color:var(--color-action); font-size:13px; font-weight:500; line-height:20px; }
.site-page .project-context { display:flex; flex-wrap:wrap; gap:12px 24px; align-items:center; padding-block:20px; border-block:1px solid var(--color-border-subtle); }
.site-page .project-context p { margin:0; }
.site-page .context-notice,.site-page .project-notice { padding:16px; border-left:3px solid var(--color-action); background:var(--color-action-soft); color:var(--color-text-primary); font-size:14px; line-height:22px; margin-block:16px; }
.site-page [data-project-notice][hidden],.site-page .project-context[hidden] { display:none; }
.site-page .project-edit { margin-top:0; }
.site-page .project-edit + .form-group { margin-top:32px; }
.site-page .need-gateways h2 { font-size:var(--type-card); line-height:var(--line-card); }
.site-page .party-rental-link { display:flex; justify-content:center; width:fit-content; margin:20px auto 0; color:var(--color-text-on-dark); text-decoration:underline; min-height:44px; align-items:center; }
.site-page .option-card .recommendation-label { display:block; }
.site-page .outfit-card[data-recommended] .recommendation-label { margin:0 24px 16px; }
@media(min-width:1024px) { .site-page .project-choice-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(min-width:768px) and (max-width:1023px) {
 .site-page .nav { height:72px; }
 .site-page .menu-toggle { display:flex; }
 .site-page .nav-links:not(.is-open) { display:none; }
 .site-page .nav-links.is-open { position:absolute; top:72px; left:0; right:0; flex-direction:column; align-items:stretch; gap:12px; padding:20px 32px; background:var(--color-graphite); font-size:16px; }
 .site-page .needs-menu { position:static; }
 .site-page .needs-dropdown,.site-page .nav-catalogue { position:static; width:100%; min-width:0; max-width:none; border:0; box-shadow:none; padding:8px 0; }
}


.site-page .outfit-card,.site-page .option-card { position:relative; }
.site-page .outfit-card .recommendation-label,.site-page .option-card .recommendation-label { position:absolute; inset:16px auto auto 16px; max-width:calc(100% - 72px); padding:4px 8px; border:1px solid var(--color-border-subtle); border-radius:8px; background:var(--color-surface); color:var(--color-action); font-size:12px; line-height:18px; margin:0; }
.site-page .recommendation-label[hidden] { display:none; }
.site-page .project-context { position:sticky; top:var(--page-nav-height); z-index:5; background:var(--color-surface); padding-block:12px; }
.site-page .project-context strong { font-size:14px; line-height:22px; }
.site-page .project-context .text-link { min-height:44px; }
.site-page:has(.project-context:not([hidden])) main :is(section[id],.library-option-group[id]) { scroll-margin-top:calc(var(--page-nav-height) + var(--project-context-height,100px) + 16px - 88px); }
@media(min-width:768px) and (max-width:1023px) {
 .site-page .nav-catalogue,.site-page .needs-dropdown { transform:none; inset:auto; max-height:none; overflow:visible; }
}

@media(min-width:768px) and (max-width:1023px) {
 .site-page .nav-links.is-open { max-height:calc(100dvh - 72px); overflow-y:auto; overscroll-behavior:contain; padding-bottom:24px; }
 .site-page .needs-dropdown,.site-page .nav-catalogue { background:var(--color-graphite); color:var(--color-text-on-dark); border-radius:0; }
}

@media(min-width:768px) and (max-width:1023px) {
 .site-page .nav-section-title,.site-page .nav-caption { color:var(--color-text-muted-on-dark); }
 .site-page .nav-column .nav-create { color:var(--color-text-on-dark); }
 .site-page .nav-column > a { border-color:var(--color-border-control); }
}


/* Galeries horizontales communes : les cartes restent dans le HTML et les gestes natifs. */
.site-page :is(.carousel-track,.needs-grid,.custom-grid,.outfit-grid,.option-grid,.project-choice-grid) {
 display:grid; grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:86%; align-items:stretch;
 gap:var(--grid-gap,16px); width:100%; max-width:100%; min-width:0; overflow-x:auto;
 padding:4px 4px 16px; scroll-behavior:auto; scroll-snap-type:none; scrollbar-width:none;
 touch-action:auto; overscroll-behavior-x:contain; overscroll-behavior-y:auto; -webkit-overflow-scrolling:touch;
}
.site-page :is(.carousel-track,.needs-grid,.custom-grid,.outfit-grid,.option-grid,.project-choice-grid)::-webkit-scrollbar { display:none; }
.site-page :is(.carousel-track,.needs-grid,.custom-grid,.outfit-grid,.option-grid,.project-choice-grid) > * { min-width:0; max-width:100%; }
.site-page .outfit-grid > div > .outfit-card { height:100%; }
.site-page .horizontal-rail:focus-visible { outline:2px solid var(--color-action); outline-offset:4px; border-radius:8px; }
.site-page .rail-controls { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:12px; margin:8px 0 24px; }
.site-page .rail-controls[hidden] { display:none; }
.site-page .rail-controls button { display:inline-flex; justify-content:center; align-items:center; min-width:44px; min-height:44px; border:1px solid var(--color-border-control); border-radius:999px; padding:8px 14px; background:var(--color-surface); color:var(--color-text-primary); font:inherit; font-size:15px; cursor:pointer; }
.site-page .rail-controls button:disabled { opacity:.45; cursor:default; }
.site-page .rail-controls button:focus-visible { outline:2px solid var(--color-action); outline-offset:3px; }
.site-page .rail-controls [data-rail-pause] { min-width:100px; }
.site-page .rail-position { min-width:52px; text-align:center; color:var(--color-text-secondary); font-size:14px; font-variant-numeric:tabular-nums; }
.site-page .media-carousel > .actions { justify-content:center; margin-top:8px; }
.site-page :is(.usage-form,.project-options-body,.form-group,.option-review) { min-width:0; }
@media(min-width:768px) { .site-page :is(.carousel-track,.needs-grid,.custom-grid,.outfit-grid,.option-grid,.project-choice-grid) { grid-auto-columns:46%; } }
@media(min-width:1024px) { .site-page :is(.carousel-track,.needs-grid,.custom-grid,.outfit-grid,.option-grid,.project-choice-grid) { grid-auto-columns:36%; } }
/* Alternance des surfaces verrouillées, sans ajouter de nouvelle couleur. */
.site-page #andropick { background:var(--color-surface); border-block:1px solid var(--color-border-subtle); }
.site-page #services,.site-page #appearance { background:var(--color-background); }
.site-page #missions:has(> [data-carousel]),.site-page #skills { background:var(--color-surface); border-block:1px solid var(--color-border-subtle); }
.site-page .media-carousel .carousel-slide { background:var(--color-surface); border:1px solid var(--color-border-subtle); border-radius:var(--radius-card); overflow:hidden; }
.site-page .media-carousel :is(.gallery-placeholder,.gallery-image) { border:0; border-radius:0; }
.site-page .media-carousel .gallery-caption { padding:24px; }
.site-page #skills .carousel-slide,.site-page #missions > [data-carousel] .carousel-slide { background:var(--color-background); }
/* Le contact reste accessible sans recouvrir les commandes des galeries mobiles. */
@media(max-width:767px) {
 .site-page .contact-floating { width:60px; height:60px; padding:5px; justify-content:center; gap:0; }
 .site-page .contact-floating span { display:none; }
 .site-page .contact-floating img { width:48px; height:48px; }
 .site-page .rail-controls { padding-right:72px; }
}

/* Projet partagé : trois étapes lisibles, une hiérarchie commune à chaque besoin. */
.site-page .project-entry-note { margin-top:24px; color:var(--color-text-secondary); max-width:60ch; }
.site-page .need-overview-grid { display:grid; gap:24px; align-items:start; }
.site-page .need-overview-list { list-style:none; margin:0; padding:0; display:grid; gap:16px; }
.site-page .need-overview-task { display:flex; align-items:flex-start; gap:20px; padding:24px; border:1px solid var(--color-border-subtle); border-radius:20px; background:var(--color-surface); }
.site-page .need-overview-number { flex:0 0 40px; display:grid; place-items:center; width:40px; height:40px; border:1px solid var(--color-border-subtle); border-radius:50%; font-size:14px; color:var(--color-text-secondary); }
.site-page .need-overview-task h3 { font-size:20px; line-height:26px; margin:0 0 8px; }
.site-page .need-overview-task p { color:var(--color-text-secondary); line-height:1.65; margin:0; }
.site-page .need-overview-scope { padding:32px; background:var(--color-surface-muted); border-radius:24px; }
.site-page .need-overview-scope h3 { font-size:24px; line-height:30px; margin:12px 0 20px; }
.site-page .need-overview-scope p:not(.eyeline) { color:var(--color-text-secondary); line-height:1.7; }
.site-page .need-overview-next { margin-top:24px; padding-top:24px; border-top:1px solid var(--color-border-control); }
.site-page .project-composer { background:var(--color-surface-muted); border-block:1px solid var(--color-border-subtle); }
.site-page .composer-heading { display:grid; gap:24px; margin-bottom:32px; }
.site-page .composer-heading h2 { font-size:clamp(32px,4vw,48px); line-height:1.12; letter-spacing:-.035em; max-width:18ch; margin-top:12px; }
.site-page .composer-heading > p { color:var(--color-text-secondary); font-size:18px; line-height:28px; max-width:42ch; }
.site-page .project-step-nav { position:sticky; top:var(--page-nav-height); z-index:30; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; padding:12px 0; margin-bottom:24px; background:var(--color-surface-muted); }
.site-page .project-step-nav a { display:flex; align-items:center; justify-content:center; gap:8px; min-height:52px; padding:10px 8px; color:var(--color-text-primary); background:var(--color-surface); border:1px solid var(--color-border-control); border-radius:12px; font-weight:500; font-size:14px; text-decoration:none; }
.site-page .project-step-nav a > span { font-size:13px; color:var(--color-text-secondary); }
.site-page .project-step-nav a:hover { border-color:var(--color-action); color:var(--color-action); }
.site-page .project-step-nav a:focus-visible { outline:3px solid var(--color-action); outline-offset:2px; }
.site-page .usage-form .project-step { min-width:0; padding:24px; margin:0 0 24px; border:1px solid var(--color-border-subtle); border-radius:24px; background:var(--color-surface); scroll-margin-top:calc(var(--page-nav-height) + 100px); }
.site-page .usage-form .project-step:focus-visible { outline:2px solid var(--color-action); outline-offset:4px; }
.site-page .usage-form .project-step > legend { display:flex; align-items:center; gap:16px; width:100%; padding:0; margin:0; float:left; }
.site-page .project-step .step-body { clear:both; padding-top:28px; }
.site-page .step-number { display:grid; place-items:center; flex:0 0 44px; width:44px; height:44px; border-radius:50%; background:var(--color-graphite); color:var(--color-text-on-dark); font-size:20px; font-weight:500; }
.site-page .step-heading { display:grid; gap:6px; min-width:0; }
.site-page .step-heading > strong { font-size:24px; line-height:30px; font-weight:600; letter-spacing:-.025em; }
.site-page .step-heading > span { font-size:15px; line-height:22px; color:var(--color-text-secondary); font-weight:400; }
.site-page .usage-form .project-step .field { max-width:760px; width:100%; margin-block:24px; }
.site-page .project-step .mode-options { display:grid; grid-template-columns:minmax(0,1fr); gap:12px; }
.site-page .project-step .mode-options label { position:relative; display:flex; align-items:flex-start; flex-direction:column; min-width:0; padding:20px; gap:14px; border-radius:16px; background:var(--color-background); cursor:pointer; }
.site-page .project-step .mode-options input { flex:none; width:20px; height:20px; accent-color:var(--color-action); margin:0; }
.site-page .project-step .mode-options strong { display:block; font-size:20px; line-height:26px; font-weight:600; }
.site-page .project-step .mode-options small { font-size:15px; line-height:22px; margin-top:8px; }
.site-page .project-step .mode-options label:has(:checked) { background:var(--color-action-soft); border:2px solid var(--color-action); padding:19px; }
.site-page .project-step .mode-options label:has(:focus-visible) { outline:3px solid var(--color-action); outline-offset:3px; }
.site-page .composer-options { display:grid; grid-template-columns:minmax(0,1fr); gap:16px; margin:24px 0; align-items:start; }
.site-page .composer-options > .project-options { margin:0; min-width:0; background:var(--color-background); border-color:var(--color-border-subtle); }
.site-page .composer-options > .project-options[open] { grid-column:1/-1; border-color:var(--color-border-control); }
.site-page .composer-option-panel > summary { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; padding:20px; min-height:120px; }
.site-page .composer-option-panel > summary::after { grid-column:2; grid-row:1/3; align-self:center; }
.site-page .option-summary-copy { display:grid; gap:8px; }
.site-page .option-summary-copy > strong { font-size:20px; line-height:26px; font-weight:600; }
.site-page .option-summary-copy > span { font-size:14px; line-height:22px; font-weight:400; color:var(--color-text-secondary); }
.site-page .composer-option-panel > summary .choice-count { grid-column:1; font-size:13px; }
.site-page .composer-extra { background:var(--color-background); border-color:var(--color-border-subtle); }
.site-page .composer-subheading { margin-top:32px; margin-bottom:16px; }
.site-page .composer-subheading h3 { font-size:22px; line-height:28px; }
.site-page .composer-subheading p { margin-top:8px; color:var(--color-text-secondary); }
.site-page .project-step .composer-tasks { display:grid; grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:88%; gap:16px; overflow-x:auto; width:100%; padding:4px 4px 16px; touch-action:auto; overscroll-behavior-x:contain; scrollbar-width:none; }
.site-page .composer-tasks::-webkit-scrollbar { display:none; }
.site-page .project-step .composer-tasks label { min-width:0; display:flex; flex-direction:column; padding:20px; border-radius:16px; background:var(--color-background); gap:16px; }
.site-page .composer-tasks label > span { display:grid; gap:10px; }
.site-page .composer-tasks strong { font-size:18px; line-height:24px; font-weight:600; }
.site-page .composer-tasks label > span > span { font-size:15px; line-height:23px; color:var(--color-text-secondary); }
.site-page .composer-tasks input { width:20px; height:20px; margin:0; }
.site-page .composer-tasks label:has(:checked) { background:var(--color-action-soft); }
.site-page .project-step > .step-body > .field-help:last-child { padding:20px 0 0; margin-top:24px; border-top:1px solid var(--color-border-subtle); font-size:14px; line-height:22px; }
.site-page .project-composer .usage-recap { border:1px solid var(--color-border-subtle); background:var(--color-surface); border-radius:24px; padding:28px; gap:24px; }
.site-page .usage-recap > div { flex:1 1 300px; min-width:0; }
.site-page .usage-recap h3 { font-size:22px; margin-bottom:12px; }
.site-page .usage-recap p { color:var(--color-text-secondary); line-height:1.7; }
@media(min-width:360px) { .site-page .project-step .mode-options { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(min-width:768px) {
 .site-page .need-overview-grid { grid-template-columns:1.25fr 1fr; gap:40px; }
 .site-page .composer-heading { grid-template-columns:1.2fr 1fr; align-items:end; }
 .site-page .composer-options { grid-template-columns:repeat(3,minmax(0,1fr)); }
 .site-page .usage-form .project-step { padding:32px; margin-bottom:32px; }
 .site-page .project-step .composer-tasks { grid-auto-columns:calc((100% - 32px)/3); }
 .site-page .project-step-nav { max-width:720px; }
}
@media(max-width:767px) {
 .site-page .usage-form .project-step { padding:16px; border-radius:20px; }
 .site-page .step-number { flex-basis:36px; width:36px; height:36px; font-size:18px; }
 .site-page .step-heading > strong { font-size:22px; line-height:28px; }
 .site-page .step-heading > span { font-size:14px; line-height:21px; }
 .site-page .project-step .mode-options { gap:8px; }
 .site-page .project-step .mode-options label { padding:12px 10px; min-height:164px; gap:12px; }
 .site-page .project-step .mode-options label:has(:checked) { padding:11px 9px; }
 .site-page .project-step .mode-options strong { font-size:15px; line-height:21px; overflow-wrap:normal; }
 .site-page .project-step .mode-options small { font-size:13px; line-height:19px; }
 .site-page .project-step-nav a { flex-direction:column; gap:2px; font-size:12px; padding:8px 4px; }
 .site-page .need-overview-scope { padding:24px; }
 .site-page .need-overview-task { padding:20px; gap:12px; }
 .site-page .composer-option-panel > summary { min-height:100px; }
.site-page .project-step .rail-controls { padding-right:60px; gap:8px; }
}

/* Catalogues : choisir une famille avant de comparer les possibilités. */
.site-page .catalogue-navigation { display:grid; grid-template-columns:minmax(0,1fr); gap:12px; margin-top:32px; scroll-margin-top:calc(var(--page-nav-height) + 24px); }
.site-page .catalogue-jump-card { display:grid; grid-template-columns:1fr auto; gap:8px 16px; padding:20px; border:1px solid var(--color-border-control); border-radius:20px; background:var(--color-surface); color:var(--color-text-primary); text-decoration:none; min-width:0; }
.site-page .catalogue-jump-card h2 { grid-column:1; grid-row:1; font-size:20px; line-height:26px; letter-spacing:-.02em; margin:0; }
.site-page .catalogue-jump-card p { grid-column:1; margin:0; color:var(--color-text-secondary); font-size:14px; line-height:22px; }
.site-page .catalogue-jump-count { grid-column:1; font-size:12px; line-height:20px; color:var(--color-text-secondary); }
.site-page .catalogue-jump-link { grid-column:2; grid-row:1/4; align-self:center; display:flex; align-items:center; gap:8px; color:var(--color-action); font-size:14px; }
.site-page .catalogue-jump-link svg { width:20px; height:20px; flex:none; }
.site-page .catalogue-jump-card:hover { border-color:var(--color-action); background:var(--color-action-soft); }
.site-page .catalogue-jump-card:focus-visible { outline:3px solid var(--color-action); outline-offset:4px; }
.site-page .catalogue-family { border-top:1px solid var(--color-border-subtle); scroll-margin-top:calc(var(--page-nav-height) + 24px); }
.site-page .catalogue-family:nth-of-type(even) { background:var(--color-surface); }
.site-page .catalogue-family .section-top { margin-bottom:32px; }
.site-page .catalogue-family-grid:has(> :only-child) { grid-auto-columns:minmax(0,1fr); max-width:600px; }
.site-page .catalogue-item-card { display:flex; flex-direction:column; padding:24px; border:1px solid var(--color-border-subtle); background:var(--color-background); }
.site-page .catalogue-family:nth-of-type(odd) .catalogue-item-card { background:var(--color-surface); }
.site-page .catalogue-item-card h3 { font-size:24px; line-height:30px; margin:16px 0; }
.site-page .catalogue-item-card .usage-next { margin-top:auto; padding-top:24px; }
.site-page .catalogue-item-card .mission-tasks { padding-left:20px; font-size:15px; line-height:24px; }
.site-page .catalogue-back { display:inline-flex; align-items:center; gap:8px; min-height:44px; font-size:14px; margin-top:16px; }
.site-page .catalogue-bypass { display:inline-flex; align-items:center; gap:8px; min-height:44px; margin-top:20px; font-size:14px; }
.site-page .catalogue-help-panel { display:grid; gap:24px; padding:28px; background:var(--color-surface-muted); border-radius:24px; }
.site-page .catalogue-help-panel h2 { font-size:28px; line-height:34px; margin:0 0 12px; }
.site-page .catalogue-help-panel p { color:var(--color-text-secondary); line-height:26px; max-width:60ch; }
.site-page .catalogue-help-panel .actions { margin:0; align-self:center; }
.site-page .library-family { border-top:1px solid var(--color-border-subtle); background:var(--color-surface); }
.site-page .library-family:nth-of-type(even) { background:var(--color-background); }
.site-page .library-family > .container > .section-top { margin-bottom:32px; }
.site-page .library-option-group + .library-option-group { margin-top:40px; padding-top:32px; border-top:1px solid var(--color-border-subtle); }
.site-page .library-option-heading { display:grid; gap:12px; margin-bottom:24px; }
.site-page .library-option-heading h3 { font-size:24px; line-height:30px; }
.site-page .library-option-heading p { max-width:65ch; color:var(--color-text-secondary); font-size:16px; line-height:26px; }
.site-page .library-option-heading:has(> p:only-child) { display:block; }
.site-page .library-family .option-card { background:var(--color-surface); }
.site-page .library-option-group { scroll-margin-top:calc(var(--page-nav-height) + 160px); }
.site-page .project-context-copy { display:grid; gap:4px; }
.site-page .project-context-copy > span { font-size:13px; line-height:20px; color:var(--color-text-secondary); }
.site-page .project-context { justify-content:space-between; }
.site-page .library-model-intro { margin-block:24px; padding:24px; background:var(--color-surface-muted); border-radius:20px; }
.site-page .library-model-intro label { font-weight:600; }
.site-page .library-model-intro p { max-width:70ch; }
.site-page .outfit-filter-label { display:block; margin-bottom:12px; font-size:14px; color:var(--color-text-secondary); }
@media(min-width:768px) {
 .site-page .catalogue-navigation { grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
 .site-page .catalogue-navigation:has(> :nth-child(4)) { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .site-page .catalogue-jump-card { display:flex; flex-direction:column; gap:12px; padding:24px; }
 .site-page .catalogue-jump-card h2 { order:-1; font-size:22px; line-height:28px; }
 .site-page .catalogue-jump-count { margin-top:auto; padding-top:12px; }
 .site-page .catalogue-jump-link { align-self:flex-start; }
 .site-page .catalogue-help-panel { grid-template-columns:1.4fr 1fr; gap:40px; padding:40px; align-items:center; }
 .site-page .library-option-heading { grid-template-columns:1fr 2fr; gap:32px; }
 .site-page .catalogue-family-grid { grid-auto-columns:46%; }
 .site-page .catalogue-family-grid:has(> :only-child) { grid-auto-columns:minmax(0,1fr); max-width:600px; }
}
@media(min-width:1200px) {
 .site-page .catalogue-navigation:has(> :nth-child(4)) { grid-template-columns:repeat(4,minmax(0,1fr)); }
 .site-page .catalogue-family-grid { grid-auto-columns:calc((100% - 40px)/3); gap:20px; }
 .site-page .catalogue-family-grid:has(> :nth-child(2):last-child) { grid-auto-columns:calc((100% - 20px)/2); }
}
@media(max-width:359px) {
 .site-page .catalogue-jump-card { padding:16px; gap:8px; }
 .site-page .catalogue-jump-link { font-size:12px; gap:4px; }
 .site-page .catalogue-jump-card h2 { font-size:18px; line-height:24px; }
}

/* Footer : les mêmes familles, avec une lecture compacte sur mobile. */
.site-page .footer-organized { padding-top:48px; }
.site-page .footer-intro { display:grid; gap:36px; padding-bottom:40px; }
.site-page .footer-identity { max-width:38ch; }
.site-page .footer-identity .brand { width:180px; }
.site-page .footer-signature { margin:24px 0 16px; font-size:24px; line-height:32px; font-weight:500; letter-spacing:-.02em; }
.site-page .footer-identity > p:last-child { color:var(--color-text-muted-on-dark); font-size:15px; line-height:24px; }
.site-page .footer-project { padding:28px; border:1px solid var(--color-border-control); border-radius:20px; align-self:start; }
.site-page .footer-project h2 { font-size:28px; line-height:34px; margin-bottom:12px; }
.site-page .footer-project p { color:var(--color-text-muted-on-dark); font-size:16px; line-height:26px; max-width:46ch; margin-bottom:24px; }
.site-page .footer-project .button { background:var(--color-surface); color:var(--color-text-primary); border-color:var(--color-surface); }
.site-page .footer-project .button:hover { background:var(--color-background); color:var(--color-text-primary); text-decoration:none; }
.site-page .footer-groups { display:grid; gap:0; border-top:1px solid var(--color-border-control); }
.site-page .footer-group { min-width:0; border-bottom:1px solid var(--color-border-control); }
.site-page .footer-group summary { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:76px; padding:20px 0; cursor:pointer; list-style:none; }
.site-page .footer-group summary::-webkit-details-marker { display:none; }
.site-page .footer-group h2 { font-size:18px; line-height:26px; margin:0; font-weight:500; }
.site-page .footer-toggle { display:grid; place-items:center; flex:none; width:28px; height:28px; font-size:24px; font-weight:400; }
.site-page .footer-group[open] .footer-toggle { font-size:0; }
.site-page .footer-group[open] .footer-toggle::before { content:'−'; font-size:24px; }
.site-page .footer-group-links { display:grid; align-content:start; padding-bottom:24px; gap:0; }
.site-page .footer-group-links a { color:var(--color-text-muted-on-dark); font-size:14px; line-height:22px; min-height:44px; width:fit-content; max-width:100%; gap:8px; text-decoration:none; }
.site-page .footer-group-links a:hover { color:var(--color-text-on-dark); text-decoration:underline; }
.site-page .footer-group-links h3 { font-size:12px; line-height:20px; color:var(--color-text-muted-on-dark); font-weight:500; letter-spacing:.04em; text-transform:uppercase; margin:4px 0 8px; }
.site-page .footer-group-links h3:not(:first-child) { margin-top:20px; }
.site-page .footer-group-links .footer-all { margin-top:16px; color:var(--color-text-on-dark); font-weight:500; }
.site-page .footer-group summary:focus-visible { outline:2px solid var(--color-text-on-dark); outline-offset:4px; border-radius:4px; }
.site-page .footer-contact-details { display:grid; gap:24px; padding-block:32px; }
.site-page .footer-contact-details h2 { font-size:13px; line-height:20px; color:var(--color-text-muted-on-dark); font-weight:400; margin-bottom:8px; }
.site-page .footer-contact-details a { font-size:16px; line-height:24px; color:var(--color-text-on-dark); overflow-wrap:anywhere; }
.site-page .footer-contact-details address { font-style:normal; font-size:15px; line-height:24px; max-width:30ch; }
.site-page .footer-legal { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; padding-top:20px; border-top:1px solid var(--color-border-control); font-size:13px; color:var(--color-text-muted-on-dark); }
.site-page .footer-legal a { gap:12px; }
.site-page .contact-honeypot { display:none; }
.site-page .contact-protection { margin-block:24px; padding:24px; border:1px solid var(--color-border-subtle); border-radius:16px; background:var(--color-background); }
.site-page .contact-protection input { max-width:160px; }
.site-page .contact-protection [data-contact-challenge] { margin-block:12px; font-weight:500; }
.site-page .contact-protection button { background:none; border:0; color:var(--color-action); font:inherit; cursor:pointer; min-height:44px; padding:8px 0; text-decoration:underline; }
@media(min-width:768px) {
 .site-page .footer-intro { grid-template-columns:1fr 1fr; gap:48px; padding-bottom:48px; }
 .site-page .footer-contact-details { grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; padding-block:40px; }
}
@media(min-width:1024px) {
 .site-page .footer-organized { padding-top:64px; }
 .site-page .footer-groups { grid-template-columns:repeat(4,minmax(0,1fr)); gap:32px; padding-block:32px; border-bottom:1px solid var(--color-border-control); align-items:start; }
 .site-page .footer-group { border:0; }
 .site-page .footer-group summary { min-height:52px; padding:0 0 20px; align-items:flex-start; }
 .site-page .footer-toggle { width:20px; height:24px; font-size:20px; }
 .site-page .footer-group-links { padding-bottom:0; }
}

/* Mascotte fournie : dimensions réservées, silhouette entière, navigation uniquement. */
.site-page .header .brand-mascot { width:84px; min-height:44px; }
.site-page .header .brand-mascot img { width:84px; height:56px; object-fit:contain; }


/* Formats paysage dans les cartes carrées : préserver le robot et les inscriptions. */
.site-page .media-carousel .gallery-image-entire { object-fit:contain; background:var(--color-background); }


/* Visuels de besoins : mêmes images que leurs cartes d’accueil. */
.site-page .need-hero-media { position:relative; min-width:0; margin:0; overflow:hidden; border-radius:var(--radius-card); aspect-ratio:1 / 1; }
.site-page .need-hero-media img { display:block; width:100%; height:100%; object-fit:cover; }
.site-page .need-hero-media figcaption { position:absolute; bottom:16px; left:16px; padding:4px 8px; border-radius:8px; background:var(--color-surface); color:var(--color-text-secondary); font-size:12px; }
.site-page .hero-poster.hero-event-poster { inset:0; width:100%; height:100%; object-fit:cover; object-position:center; opacity:1; }
.site-page .option-visual img, .site-page .outfit-card img { object-fit:cover; }

.site-page .footer-social { padding-block:24px 32px; border-top:1px solid var(--color-border-control); }
.site-page .footer-social h2 { font-size:18px; line-height:26px; margin:0 0 16px; color:var(--color-text-on-dark); }
.site-page .footer-social-links { display:flex; flex-wrap:wrap; gap:12px; }
.site-page .footer-social-links a { display:inline-flex; align-items:center; gap:10px; min-height:44px; padding:10px 16px; border:1px solid var(--color-border-control); border-radius:12px; color:var(--color-text-on-dark); text-decoration:none; }
.site-page .footer-social-links a:hover { text-decoration:underline; }
.site-page .footer-social-links a:focus-visible { outline:2px solid var(--color-text-on-dark); outline-offset:4px; }
.site-page .footer-social-links svg { width:20px; height:20px; fill:currentColor; flex:none; }

.site-page .contact-section .project-aside h2 { font-size:var(--type-section); line-height:1.15; letter-spacing:-.04em; margin-bottom:24px; }
.site-page .contact-essential { margin-top:0; }
.site-page .project-edit { margin-block:8px 24px; }
.site-page .project-edit > summary { min-height:56px; gap:12px; }
.site-page .project-edit .project-options-body > .field-help:first-child { margin-bottom:24px; }

.site-page .contact-success-mascot { display:block; width:120px; height:auto; object-fit:contain; margin:20px auto 12px; }
.site-page .configuration-overview-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:24px; }
.site-page .configuration-overview-grid ul { width:100%; max-width:100%; box-sizing:border-box; padding-left:20px; margin:0; color:var(--color-text-secondary); line-height:1.6; overflow-wrap:anywhere; }
.site-page .configuration-overview-grid h3 { max-width:100%; }
.site-page .configuration-overview-grid li + li { margin-top:16px; }
.site-page .configuration-overview-grid strong { color:var(--color-text-primary); }
.site-page .configuration-example { display:block; margin-top:8px; font-size:14px; line-height:22px; }
.site-page .configuration-overview .section-note { margin-top:24px; color:var(--color-text-secondary); font-size:14px; line-height:22px; max-width:75ch; }
.site-page .configuration-overview-grid:focus-visible { outline:2px solid var(--color-action); outline-offset:4px; border-radius:var(--radius-card); }
@media(max-width:1023px) {
 .site-page .configuration-overview-grid { grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:88%; align-items:stretch; overflow-x:auto; max-width:100%; min-width:0; padding:4px 4px 16px; scroll-snap-type:x proximity; scrollbar-width:none; touch-action:auto; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; }
 .site-page .configuration-overview-grid::-webkit-scrollbar { display:none; }
 .site-page .configuration-overview-grid > article { scroll-snap-align:start; }
}
@media(min-width:1024px) { .site-page .configuration-overview-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
.site-page .contact-success-signature { font-weight:600; }