/* Finitions fluides : boutons, verre discret et mouvements progressifs. */
:root { --ease-fluid: cubic-bezier(.22,1,.36,1); }
.solution-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
:root .btn { border-radius: 999px; min-height: 48px; transition: transform .3s var(--ease-fluid),box-shadow .3s var(--ease-fluid),background-color .25s; justify-content: center; }
:root .btn.btn-devis { background: var(--petroleum); color: white; border: 1px solid #ffffff70; }
:root .btn.btn-more { background: var(--lime); color: var(--petroleum); border: 1px solid var(--lime); }
:root .btn:hover { transform: translateY(-2px); box-shadow: 0 8px 24px #002f4528; }
:root .btn:active { transform: scale(.97); }
.solution-actions .btn { font-size: 14px; padding: 13px 23px; text-decoration: none; }
.home-page .solution-body .solution-actions { margin-top: 20px; }
.home-page .solution, .needs-grid>a, .steps article, .trust-home { transition: opacity .7s var(--ease-fluid),transform .7s var(--ease-fluid); }
.motion-pending { opacity: 0; transform: translateY(24px); }
.home-page .solution { border-radius: 24px; overflow: hidden; box-shadow: 0 12px 38px #002f4510; }
.home-page .solution .solution-image, .home-page .solution:nth-child(even) .solution-image,
.home-page .solution .solution-body, .home-page .solution:nth-child(even) .solution-body,
[data-theme="dark"] .home-page .solution .solution-body, [data-theme="dark"] .home-page .solution .solution-image { border-radius: 0; }
.solution-image img, .gallery-photo img, .habitat-photos img { transition: transform .7s var(--ease-fluid); }
@media(hover:hover) { .solution-image:hover img, .gallery-photo:hover img, .habitat-photos a:hover img { transform: scale(1.025); } .needs-grid>a:hover { transform: translateY(-4px); } }
.site-header, [data-theme="dark"] .site-header { backdrop-filter: blur(24px) saturate(150%); -webkit-backdrop-filter: blur(24px) saturate(150%); box-shadow: 0 1px 18px #00344a0b; }
.site-drawer { background: linear-gradient(155deg,rgba(var(--petroleum-rgb),.96),rgba(var(--petroleum-rgb),.89)); backdrop-filter: blur(28px) saturate(150%); -webkit-backdrop-filter: blur(28px) saturate(150%); border-radius: 0 28px 28px 0; }
.drawer-close, .site-header .header .menu-toggle, .theme-toggle { transition: background-color .25s,transform .3s var(--ease-fluid); }
.home-page .trust-home>.text-panel, .contact .contact-shell, .needs-grid>a, [data-theme="dark"] .needs-grid>a { border-radius: 24px; }
.detail-hero .intro { max-width: 600px; }
.pro-banner { display: grid; grid-template-columns: 100px minmax(0,1fr); gap: 24px; align-items: center; border-radius: 24px; }
.pro-banner .solution-actions { grid-column: 2; margin-top: 0; }
.gallery-zoom::before, .habitat-photos figure>a>span::before { content: '+'; font-size: 22px; }
.home-shortcuts a { transition: background-color .3s var(--ease-fluid),color .3s; }
.home-shortcuts a>b:empty, .needs-grid a>b:empty { display: none; }
.home-shortcuts a { grid-template-columns: 1fr; }
@media(max-width:600px) {
  .solution-actions { gap: 10px; width: 100%; }
  .solution-actions .btn { flex: 1 1 140px; font-size: 13px; padding: 12px 17px; }
  .pro-banner { grid-template-columns: 1fr; }
  .pro-banner .solution-actions { grid-column: 1; }
  .pro-banner .pro-thumb { width: 100%; height: auto; max-height: 220px; object-fit: cover; border-radius: 16px; }
}
@media(prefers-reduced-motion:reduce) { .motion-pending { opacity: 1; transform: none; } *,*::before,*::after { animation: none!important; transition: none!important; } }

/* Les quatre visuels se fondent dans la surface pétrole, comme la bannière. */
.home-page .solution-grid .solution { position: relative; isolation: isolate; min-height: 390px; background: var(--petroleum); }
.home-page .solution-grid .solution-image { position: absolute; inset: 0 auto 0 0; width: 62%; height: 100%; z-index: -1; overflow: hidden; mask-image: linear-gradient(90deg,#000 45%,transparent 100%); -webkit-mask-image: linear-gradient(90deg,#000 45%,transparent 100%); }
.home-page .solution-grid .solution-image img { display: block; width: 100%; height: 100%; min-height: 0; aspect-ratio: auto; object-fit: cover; }
.home-page .solution-grid .solution:nth-child(even) .solution-image { inset: 0 0 0 auto; mask-image: linear-gradient(270deg,#000 45%,transparent 100%); -webkit-mask-image: linear-gradient(270deg,#000 45%,transparent 100%); }
.home-page .solution-grid .solution-body, [data-theme="dark"] .home-page .solution-grid .solution-body { grid-column: 2; background: transparent; padding: 42px 38px 42px 20px; }
.home-page .solution-grid .solution:nth-child(even) .solution-body { grid-column: 1; padding: 42px 20px 42px 38px; }
.home-page .solution-grid .solution-image>span { display: none; }
@media(max-width:760px) {
 .home-page .solution-grid .solution { display: flex; flex-direction: column; min-height: 0; }
 .home-page .solution-grid .solution-image, .home-page .solution-grid .solution:nth-child(even) .solution-image { position: relative; inset: auto; width: 100%; height: 290px; order: 0; flex-shrink: 0; mask-image: linear-gradient(#000 55%,transparent 100%); -webkit-mask-image: linear-gradient(#000 55%,transparent 100%); }
 .home-page .solution-grid .solution-body, .home-page .solution-grid .solution:nth-child(even) .solution-body, [data-theme="dark"] .home-page .solution-grid .solution-body { padding: 0 28px 32px; margin-top: -12px; }
}

/* En-tête compact : la surface se réduit sans déplacer le contenu de la page. */
:root .site-header { --header-size: 112px; height: 112px; isolation: isolate; background: transparent; border: 0; backdrop-filter: none; -webkit-backdrop-filter: none; box-shadow: none; pointer-events: none; }
:root .site-header::before { content: ''; position: absolute; inset: 0 0 auto; height: var(--header-size); z-index: -1; background: rgba(255,255,255,.94); border-bottom: 1px solid var(--petroleum-border); transition: height .35s var(--ease-fluid),background-color .35s,box-shadow .35s; backdrop-filter: blur(20px) saturate(140%); -webkit-backdrop-filter: blur(20px) saturate(140%); }
:root[data-theme="dark"] .site-header::before { background: rgba(36,39,43,.94); }
:root .site-header .header { height: var(--header-size); min-height: 0; transition: height .35s var(--ease-fluid); }
:root .site-header .header>* { pointer-events: auto; }
:root .site-header .header .brand { width: 180px; transform: none; opacity: 1; }
:root .site-header .header .brand img { width: 100%; height: 100px!important; transition: height .35s var(--ease-fluid); }
:root.is-scrolled .site-header { --header-size: 72px; }
:root.is-scrolled .site-header::before { background: rgba(255,255,255,.55); box-shadow: 0 6px 24px #002f4510; }
:root[data-theme="dark"].is-scrolled .site-header::before { background: rgba(36,39,43,.5); }
:root.is-scrolled .site-header .header .brand img { height: 64px!important; }
:root .site-header .header .menu-toggle, :root .site-header .header .theme-toggle { background: rgba(255,255,255,.84); color: var(--petroleum); }
:root[data-theme="dark"] .site-header .header .menu-toggle, :root[data-theme="dark"] .site-header .header .theme-toggle { background: rgba(0,76,108,.88); color: white; }
:root .site-header .site-drawer { pointer-events: auto; }
html { scroll-padding-top: 90px; }
@media(max-width:600px) {
 :root .site-header { --header-size: 92px; height: 92px; }
 :root .site-header .header .brand { width: 140px; }
 :root .site-header .header .brand img { height: 82px!important; }
 :root.is-scrolled .site-header { --header-size: 64px; }
 :root.is-scrolled .site-header .header .brand img { height: 56px!important; }
 html { scroll-padding-top: 80px; }
}
@media(prefers-reduced-motion:reduce) { :root .site-header::before, :root .site-header .header, :root .site-header .header .brand img { transition: none; } }