/* Keep the original layout and media; preserve the approved ribbon fold in both themes. */
.themed-logo[src*="centrieweb-plie-1"] { filter: none !important; }
:root[data-theme=light] .themed-logo[src*="centrieweb-plie-1"] { filter: invert(1) !important; }
html { scroll-behavior: smooth; scroll-padding-top: 64px; }
body { overflow-x: clip; }
#hero { overflow: clip; }
#features article { perspective: 1400px; }
#features article > .aspect-video {
  transform: rotateX(var(--cw-tilt, 0deg)) rotateY(var(--cw-turn, 0deg)) translateZ(var(--cw-depth, 0px));
  transform-origin: center;
  backface-visibility: hidden;
}
#hero canvas { transform: perspective(1800px) rotateX(var(--cw-hero-x, 0deg)) rotateY(var(--cw-hero-y, 0deg)); }
.cw-note { max-width: 1280px; margin: 0 auto; padding: 12px 24px; border-top: 1px solid var(--line); color: var(--muted); font: 11px/1.8 var(--font-geist-mono), monospace; }
.cw-note a { text-decoration: underline; text-underline-offset: 3px; }
.cw-dialog { width: min(560px, calc(100% - 32px)); max-height: calc(100svh - 48px); overflow: auto; padding: 30px; border: 1px solid var(--line-strong); border-radius: 0; background: var(--bg); color: var(--ink); }
.cw-dialog::backdrop { background: #000a; backdrop-filter: blur(8px); }
.cw-dialog h2 { margin: 18px 0; color: var(--ink-strong); font: 500 30px/1.08 var(--font-archivo), sans-serif; letter-spacing: -.03em; }
.cw-dialog p { margin: 16px 0; color: var(--muted); line-height: 1.6; }
.cw-dialog label { display: block; margin: 20px 0 8px; font-size: 13px; }
.cw-dialog input, .cw-dialog textarea { display: block; width: 100%; padding: 12px; border: 1px solid var(--line-strong); border-radius: 0; background: var(--bg-sunken); color: var(--ink); font: inherit; }
.cw-dialog textarea { min-height: 120px; resize: vertical; }
.cw-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 24px; }
.cw-button { display: inline-flex; justify-content: center; align-items: center; min-height: 44px; padding: 12px 16px; border: 1px solid var(--line-strong); background: var(--invert-bg); color: var(--invert-fg); font: 600 11px/1.4 var(--font-geist-mono), monospace; text-transform: uppercase; letter-spacing: .08em; text-decoration: none; cursor: pointer; }
.cw-secondary { background: transparent; color: var(--ink); }
:focus-visible { outline: 2px solid var(--accent-ink); outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  #features article > .aspect-video, #hero canvas { transform: none !important; }
}
.cw-video-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: var(--line); border-top: 1px solid var(--line); }
.cw-video-card { min-width: 0; margin: 0; background: var(--bg); }
.cw-video-caption { padding: 24px; }
.cw-video-caption h3 { margin-top: 12px; color: var(--ink-strong); font: 500 26px/1.15 var(--font-archivo), sans-serif; letter-spacing: -.025em; }
.cw-video-caption p { margin-top: 10px; color: var(--muted); font-size: 14px; line-height: 1.6; }
.cw-style-video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: contain; background: #000; }
@media (max-width: 767px) { .cw-video-grid { grid-template-columns: 1fr; } }
.cw-footer-grid { display: grid; grid-template-columns: 2fr repeat(3, 1fr); gap: 1px; background: var(--line); }
.cw-footer-link { display: block; margin-top: 18px; font-size: 13px; color: var(--muted); }
.cw-footer-link:hover { color: var(--ink-strong); }
:root[data-theme=light] img[src*="centrieweb-plie-1"] { filter: invert(1); }
a[aria-label="Contacter CENTRIEWEB"] svg { display: none; }
a[aria-label="Contacter CENTRIEWEB"]::after { content: '↗'; font-size: 20px; }
@media (max-width: 767px) { .cw-footer-grid { grid-template-columns: 1fr 1fr; } .cw-footer-grid > :first-child { grid-column: 1 / -1; } .cw-demo h4 { font-size: 22px; } }
@media (prefers-reduced-motion: reduce) { .cw-demo-panels span { animation: none; } }


/* Le thème automatique doit traiter le logo comme le thème choisi. */
@media(prefers-color-scheme:light) { :root:not([data-theme=dark]) img.themed-logo { filter:invert(1)!important; } }
.cw-dialog { margin:auto; }
@media(max-width:767px) {
  .cw-button, #mobile-nav a, .cw-footer-link { min-height:44px; }
  .cw-footer-link { display:flex; align-items:center; }
  #mobile-nav { max-height:calc(100svh - 48px); overflow-y:auto; overscroll-behavior:contain; }
  #features article { min-width:0; }
  #hero canvas { opacity:1; }
}
@media(max-width:767px) and (prefers-reduced-motion:reduce) {
  #hero [role=img][aria-label=CENTRIEWEB] { display:flex; justify-content:center; align-items:baseline; font-size:10cqw!important; white-space:nowrap; }
  #hero .wm-letter { width:auto!important; flex-shrink:0; }
}

/* Les offres et la demande prolongent la grille et les contrastes existants. */
.cw-offer-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:var(--line); border-top:1px solid var(--line); }
.cw-offer { display:flex; flex-direction:column; min-width:0; padding:32px; background:var(--bg); }
.cw-offer h2 { margin:24px 0 16px; color:var(--ink-strong); font:500 32px/1.1 var(--font-archivo),sans-serif; letter-spacing:-.03em; }
.cw-offer .cw-offer-lead { margin:0 0 20px; color:var(--ink-strong); font-size:20px; line-height:1.4; }
.cw-offer p:not(.hud-label), .cw-scope-grid p, .cw-contact-intro p:not(.hud-label) { max-width:65ch; line-height:1.7; color:var(--muted); }
.cw-offer h3, .cw-scope-grid h3 { margin:28px 0 16px; color:var(--ink-strong); font:500 20px/1.3 var(--font-archivo),sans-serif; }
.cw-offer ul, .cw-scope-grid ul { padding-left:20px; list-style:disc; color:var(--muted); }
.cw-offer li, .cw-scope-grid li { padding-left:4px; margin:12px 0; line-height:1.6; }
.cw-offer-actions { display:flex; flex-direction:column; align-items:flex-start; gap:16px; margin-top:auto; padding-top:28px; }
.cw-offer-detail { display:inline-flex; align-items:center; min-height:44px; color:var(--ink-strong); font-size:14px; text-decoration:underline; text-underline-offset:5px; }
.cw-scope-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; background:var(--line); border-top:1px solid var(--line); }
.cw-scope-grid > div { padding:32px; background:var(--bg); }
.cw-scope-grid h3 { margin-top:0; }
.cw-scope-grid p + p { margin-top:16px; }
.cw-contact-layout { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,3fr); border-top:1px solid var(--line); }
.cw-contact-intro { padding:40px; }
.cw-contact-intro h2 { margin:24px 0; color:var(--ink-strong); font:500 clamp(30px,3.5vw,44px)/1.1 var(--font-archivo),sans-serif; letter-spacing:-.03em; }
.cw-contact-intro p, .cw-contact-intro a { margin-bottom:20px; }
.cw-contact-form { min-width:0; padding:40px; border-left:1px solid var(--line); }
.cw-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:20px; }
.cw-form-grid > div { min-width:0; }
.cw-contact-form label { display:block; margin:24px 0 10px; color:var(--ink-strong); font-size:14px; }
.cw-contact-form input, .cw-contact-form textarea, .cw-contact-form select { display:block; width:100%; min-height:48px; padding:12px; border:1px solid var(--line-strong); border-radius:0; color:var(--ink); background:var(--bg-sunken); font:inherit; font-size:16px; }
.cw-contact-form textarea { min-height:160px; resize:vertical; }
.cw-contact-form ::placeholder { color:var(--muted); opacity:1; }
.cw-required-note, .cw-field-help, .cw-contact-notice, .cw-contact-status { color:var(--muted); font-size:14px; line-height:1.65; }
.cw-field-help { margin-top:10px; }
.cw-contact-details { margin-top:28px; padding:20px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.cw-contact-details summary { min-height:44px; padding:10px 0; color:var(--ink-strong); cursor:pointer; }
.cw-contact-notice { margin-top:28px; }
.cw-contact-status { margin-top:20px; color:var(--ink-strong); }
@media(max-width:900px) {
  .cw-offer-grid, .cw-contact-layout { grid-template-columns:1fr; }
  .cw-contact-form { border-left:0; border-top:1px solid var(--line); }
}
@media(max-width:600px) {
  .cw-scope-grid, .cw-form-grid { grid-template-columns:1fr; }
  .cw-offer, .cw-scope-grid > div, .cw-contact-intro, .cw-contact-form { padding:24px; }
}

/* Sur téléphone, la galaxie reste visible autour du logo ; le texte suit la scène. */
@media(max-width:1023px) {
  #hero { --cw-hero-stage:clamp(300px,47svh,400px); overflow:visible; }
  #hero > div > [aria-hidden=true] { height:var(--cw-hero-stage); bottom:auto; overflow:hidden; touch-action:pan-y; }
  #hero > div > .pointer-events-none { justify-content:flex-start; padding:calc(var(--cw-hero-stage)/2 - 20px) 24px 40px; }
  #hero [data-reveal-group] > .absolute { display:none; }
  #hero [data-reveal-group] > h1 { margin-top:calc(var(--cw-hero-stage)/2 - 8px); font-size:clamp(28px,7.4vw,38px); }
  #hero [data-reveal-group] > p { font-size:16px; line-height:1.65; }
}

@media(max-width:1023px) {
  #hero > div > [aria-hidden=true]:not(:has(canvas)) {
    background-image:url('/videos/styles/style-01-poster.jpg'),url('/videos/styles/style-03-poster.jpg'),url('/videos/styles/style-07-poster.jpg');
    background-size:30% auto,32% auto,30% auto;
    background-position:0 15%,100% 40%,15% 90%;
    background-repeat:no-repeat;
  }
}

/* Réserver le passage des titres animés sur les petits écrans. */
@media(max-width:1023px) {
  #hero > div > .pointer-events-none { z-index:auto; }
  html[data-ruler=on][data-ruler-side=right] main > section:not(#hero) { margin-right:var(--ruler-rail,36px); }
}
