body { margin: 0; background: #F1EEEA; font-family: 'Outfit', sans-serif; }
    a { color: #B98E4E; text-decoration: none; }
    a:hover { color: #8C6A38; }
    * { box-sizing: border-box; }
    ::selection { background: #B98E4E; color: #fff; }
    @keyframes spSlideA { 0%,44% {opacity:1} 50%,94% {opacity:0} 100% {opacity:1} }
    @keyframes spSlideB { 0%,44% {opacity:0} 50%,94% {opacity:1} 100% {opacity:0} }
    @keyframes spDotA { 0%,46% {background:#F1EEEA} 52%,96% {background:rgba(241,238,234,0.3)} 100% {background:#F1EEEA} }
    @keyframes spDotB { 0%,46% {background:rgba(241,238,234,0.3)} 52%,96% {background:#F1EEEA} 100% {background:rgba(241,238,234,0.3)} }
    @keyframes spTri1 { 0%,28% {opacity:1} 34%,94% {opacity:0} 100% {opacity:1} }
    @keyframes spTri2 { 0%,28% {opacity:0} 34%,61% {opacity:1} 67%,100% {opacity:0} }
    @keyframes spTri3 { 0%,61% {opacity:0} 67%,94% {opacity:1} 100% {opacity:0} }
    @keyframes spTriD1 { 0%,30% {background:#F1EEEA} 36%,96% {background:rgba(241,238,234,0.3)} 100% {background:#F1EEEA} }
    @keyframes spTriD2 { 0%,30% {background:rgba(241,238,234,0.3)} 36%,63% {background:#F1EEEA} 69%,100% {background:rgba(241,238,234,0.3)} }
    @keyframes spTriD3 { 0%,63% {background:rgba(241,238,234,0.3)} 69%,96% {background:#F1EEEA} 100% {background:rgba(241,238,234,0.3)} }
    @keyframes spAeD1 { 0%,30% {background:#F1EEEA} 36%,96% {background:rgba(241,238,234,0.3)} 100% {background:#F1EEEA} }
    @keyframes spAeD2 { 0%,30% {background:rgba(241,238,234,0.3)} 36%,63% {background:#F1EEEA} 69%,100% {background:rgba(241,238,234,0.3)} }
    @keyframes spAeD3 { 0%,63% {background:rgba(241,238,234,0.3)} 69%,96% {background:#F1EEEA} 100% {background:rgba(241,238,234,0.3)} }
    @keyframes spLogoIn {
      0%   { opacity:0; transform:perspective(1000px) rotate(-200deg) rotateY(70deg) scale(0.34) }
      35%  { opacity:1 }
      100% { opacity:1; transform:perspective(1000px) rotate(0deg) rotateY(0deg) scale(1) }
    }
    @keyframes spLineOut { to { transform:scaleX(1) } }
    @keyframes spRise { from { opacity:0; transform:translateY(16px) } to { opacity:1; transform:none } }

/* états de survol (issus de la maquette) */
.sph0:hover{color:#B98E4E !important; border-bottom:1px solid #B98E4E !important}
.sph1:hover{background:#B98E4E !important; color:#fff !important}
.sph2:hover{background:#FFFFFF !important; color:#27272A !important}
.sph3:hover{border:1px solid #F1EEEA !important; background:rgba(255,255,255,0.08) !important; color:#FFFFFF !important}
.sph4:hover{color:#B98E4E !important}
.sph5:hover{transform:translateY(-6px) !important; border-color:#B98E4E !important; box-shadow:0 30px 60px -22px rgba(0,0,0,0.95), 0 14px 40px -16px rgba(185,142,78,0.35) !important}
.sph6:hover{background:#27272A !important; color:#F1EEEA !important}
.sph7:hover{border-color:#B98E4E !important; color:#B98E4E !important}
.sph8:hover{color:#FFFFFF !important}
.spf9:focus{border-color:#B98E4E !important; background:#323235 !important}
.sph10:hover{background:#F1EEEA !important}
.sph11:hover{border-color:#B98E4E !important; background:#232326 !important; box-shadow:0 30px 60px -22px rgba(0,0,0,0.95), 0 14px 40px -16px rgba(185,142,78,0.35) !important}
.sph12:hover{transform:translateY(-6px) !important; border-color:rgba(185,142,78,0.55) !important; background:rgba(21,10,14,0.78) !important}
.sph13:hover{background:rgba(21,10,14,0.8) !important; border-color:#B98E4E !important}
.sph14:hover{background:#4A1F2C !important; color:#F1EEEA !important}
.sph15:hover{border-color:#4A1F2C !important; background:rgba(74,31,44,0.06) !important}
.sph16:hover{transform:translateY(-6px) !important; border-color:rgba(185,142,78,0.55) !important; background:rgba(23,32,57,0.78) !important}
.sph17:hover{background:rgba(23,32,57,0.8) !important; border-color:#B98E4E !important}
.sph18:hover{background:#172039 !important; color:#F1EEEA !important}
.sph19:hover{border-color:#172039 !important; background:rgba(23,32,57,0.06) !important}
.sph20:hover{transform:translateY(-6px) !important; border-color:rgba(185,142,78,0.55) !important; background:rgba(28,19,13,0.78) !important}
.sph21:hover{background:rgba(28,19,13,0.8) !important; border-color:#B98E4E !important}
.sph22:hover{background:#1C130D !important; color:#F1EEEA !important}
.sph23:hover{border-color:#4A3728 !important; background:rgba(74,55,40,0.06) !important}
.sph24:hover{background:#B98E4E !important; color:#27272A !important}
.spf25:focus{border-color:#B98E4E !important; background:#FFFFFF !important}
img { max-width: 100%; }
@media (max-width: 1040px) {
  [data-navtoggle] { display: flex !important; }
  [data-header] > div { flex-wrap: wrap; }
  [data-header] nav { display: none !important; width: 100%; flex-direction: column; align-items: stretch !important; gap: 0 !important; padding-bottom: 12px; }
  body[data-nav-open] [data-header] nav { display: flex !important; }
  body[data-nav-open] [data-header] { background: rgba(232,228,222,0.98) !important; border-bottom-color: #D8D3CC !important; backdrop-filter: blur(10px) !important; max-height: 100vh; overflow-y: auto; }
  body[data-nav-open] [data-header] nav a { color: #27272A !important; padding: 15px 2px !important; border-bottom: 1px solid #D8D3CC !important; }
  body[data-nav-open] [data-header] [data-navcta] { background: #27272A !important; color: #F1EEEA !important; text-align: center; padding: 17px 20px !important; margin-top: 14px; border-bottom: none !important; }
  body[data-nav-open] [data-navtoggle] { color: #27272A !important; border-color: #8E8A85 !important; }
}