/*
Theme Name: Observe FWI
Template: twentytwentyfour
Version: 1.0
*/

/* =====================
   GLOBAL
   ===================== */
body {
    font-family: 'Inter', sans-serif !important;
    background-color: #0a0a0a !important;
    color: #ffffff !important;
}

/* =====================
   HERO
   ===================== */
.ofwi-hero {
    padding: 100px 80px 80px !important;
    border-bottom: 1px solid #1f1f1f !important;
    margin-bottom: 0 !important;
}

.ofwi-hero .wp-block-columns {
    align-items: center !important;
    gap: 80px !important;
}

.ofwi-hero .ofwi-label {
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    color: #F5C518 !important;
    margin-bottom: 20px !important;
    display: block !important;
}

.ofwi-hero h1 {
    font-size: clamp(40px, 5vw, 64px) !important;
    font-weight: 900 !important;
    line-height: 1.05 !important;
    letter-spacing: -2px !important;
    color: #ffffff !important;
    margin-bottom: 24px !important;
}

.ofwi-hero p {
    font-size: 17px !important;
    color: #aaaaaa !important;
    line-height: 1.7 !important;
    max-width: 420px !important;
}

/* Pas de visuel (une seule colonne) : le texte utilise l'espace laissé libre */
.ofwi-hero .wp-block-columns > .wp-block-column:only-child h1 {
    max-width: 900px !important;
}

.ofwi-hero .wp-block-columns > .wp-block-column:only-child p {
    max-width: 700px !important;
}

.ofwi-hero-image {
    margin: 0 !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    position: relative !important;
}

.ofwi-hero-image img {
    width: 100% !important;
    min-height: 380px !important;
    object-fit: cover !important;
    border-radius: 16px !important;
    display: block !important;
    margin: 0 !important;
}

.ofwi-hero-image::after {
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 3px !important;
    background: #F5C518 !important;
    border-radius: 0 0 16px 16px !important;
}

.ofwi-hero-image::before {
    content: '' !important;
    position: absolute !important;
    width: 200px !important;
    height: 200px !important;
    background: #F5C518 !important;
    opacity: 0.08 !important;
    border-radius: 50% !important;
    top: -50px !important;
    right: -50px !important;
    z-index: 1 !important;
    pointer-events: none !important;
}

/* HERO TAGS */
.ofwi-hero-tags {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin-top: 32px !important;
    padding: 0 !important;
    list-style: none !important;
}

.ofwi-hero-tags li {
    padding: 8px 16px !important;
    border: 1px solid #2a2a2a !important;
    border-radius: 999px !important;
    font-size: 12px !important;
    color: #cccccc !important;
    background: #1a1a1a !important;
    list-style: none !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.ofwi-hero-tags li::marker {
    display: none !important;
    content: '' !important;
}

.ofwi-hero-tags li::before {
    content: '●' !important;
    color: #F5C518 !important;
    font-size: 8px !important;
    flex-shrink: 0 !important;
    line-height: 1 !important;
}

/* HERO COVER */
.ofwi-hero-cover {
    background-color: #1a1a1a !important;
    border-radius: 16px !important;
    min-height: 380px !important;
    position: relative !important;
    overflow: hidden !important;
}

.ofwi-hero-cover::after {
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 3px !important;
    background: #F5C518 !important;
    z-index: 2 !important;
}

.ofwi-hero-cover::before {
    content: '' !important;
    position: absolute !important;
    width: 200px !important;
    height: 200px !important;
    background: #F5C518 !important;
    opacity: 0.08 !important;
    border-radius: 50% !important;
    top: -50px !important;
    right: -50px !important;
    z-index: 1 !important;
}

.ofwi-hero.alignfull {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
}

/* =====================
   STATS
   ===================== */
.ofwi-stats {
    border-bottom: 1px solid #1f1f1f !important;
    margin-top: 0 !important;
    padding: 0 !important;
}

.ofwi-stats .wp-block-columns {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
    gap: 0 !important;
    margin: 0 !important;
    max-width: 100% !important;
}

.ofwi-stats .wp-block-column {
    border-right: 1px solid #1f1f1f !important;
    padding: 60px 40px !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
}

.ofwi-stats .wp-block-column:last-child {
    border-right: none !important;
}

.ofwi-stats .ofwi-number {
    font-size: 52px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: -2px !important;
    color: #F5C518 !important;
    margin: 0 !important;
}

.ofwi-stats .ofwi-label-stat {
    font-size: 13px !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    color: #888888 !important;
    margin-top: 8px !important;
    text-align: center !important;
}

/* =====================
   TEXTE + VISUEL
   ===================== */
.ofwi-texte-visuel {
    padding: 100px 80px !important;
    border-bottom: 1px solid #1f1f1f;
}

.ofwi-texte-visuel .ofwi-tag {
    display: inline-block !important;
    background: #F5C518 !important;
    color: #0a0a0a !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    padding: 6px 14px !important;
    border-radius: 999px !important;
    margin-bottom: 28px !important;
}

.ofwi-texte-visuel h2 {
    font-size: 42px !important;
    font-weight: 900 !important;
    letter-spacing: -1.5px !important;
    line-height: 1.1 !important;
    margin-bottom: 30px !important;
    color: #ffffff !important;
}

.ofwi-texte-visuel p {
    color: #aaaaaa !important;
    font-size: 16px !important;
    line-height: 1.8 !important;
    margin-bottom: 20px !important;
}

.ofwi-texte-visuel-image {
    margin: 0 !important;
    border-radius: 16px !important;
    overflow: hidden !important;
}

.ofwi-texte-visuel-image img {
    width: 100% !important;
    height: 100% !important;
    min-height: 400px !important;
    object-fit: cover !important;
    border-radius: 16px !important;
    display: block !important;
    border-bottom: 3px solid #F5C518 !important;
    margin: 0 !important;
}

/* =====================
   VALEURS
   ===================== */
.ofwi-valeurs {
    padding: 100px 80px !important;
    border-bottom: 1px solid #1f1f1f !important;
    
}

.ofwi-valeurs h2 {
    font-size: 42px !important;
    font-weight: 900 !important;
    letter-spacing: -1.5px !important;
    line-height: 1.1 !important;
    color: #ffffff !important;
}

.ofwi-valeurs .wp-block-group:first-of-type {
    margin-bottom: 60px !important;
}

.ofwi-valeurs .ofwi-card {
    background: #1a1a1a !important;
    padding: 50px 40px !important;
}

.ofwi-valeurs .ofwi-icon {
    background: #F5C518 !important;
    border-radius: 12px !important;
    width: 48px !important;
    height: 48px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 22px !important;
    margin-bottom: 24px !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    color: #ffffff !important;
}

.ofwi-valeurs h3 {
    font-size: 20px !important;
    font-weight: 800 !important;
    margin-bottom: 12px !important;
    color: #ffffff !important;
    text-align: left !important;
}

.ofwi-valeurs p {
    color: #888888 !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
    text-align: left !important;
}

/* =====================
   ÉQUIPE
   ===================== */
.ofwi-equipe {
    padding: 100px 80px !important;
    border-bottom: 1px solid #1f1f1f !important;
}

.ofwi-equipe h2 {
    font-size: 42px !important;
    font-weight: 900 !important;
    letter-spacing: -1.5px !important;
    line-height: 1.1 !important;
    margin-bottom: 60px !important;
    color: #ffffff !important;
}

.ofwi-membre {
    background: #1a1a1a !important;
    border-radius: 16px !important;
    overflow: hidden !important;
}

.ofwi-membre-photo {
    margin: 0 !important;
    display: block !important;
}

.ofwi-membre-photo img {
    width: 100% !important;
    height: 220px !important;
    object-fit: cover !important;
    display: block !important;
    border-bottom: 2px solid #F5C518 !important;
    border-radius: 0 !important;
    margin: 0 !important;
}

.ofwi-membre-infos {
    padding: 24px !important;
}

.ofwi-membre-nom {
    font-size: 16px !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    margin: 0 0 4px !important;
    padding: 0 !important;
}

.ofwi-membre-role {
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    color: #F5C518 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* =====================
 CTA 
  ===================== */
.ofwi-cta {
    padding: 100px 80px !important;
}

.ofwi-cta h2 {
    font-size: clamp(36px, 4vw, 52px) !important;
    font-weight: 900 !important;
    line-height: 1.05 !important;
    letter-spacing: -2px !important;
    color: #ffffff !important;
}

.ofwi-btn-cta .wp-block-button__link {
    background: #F5C518 !important;
    color: #0a0a0a !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    border-radius: 999px !important;
    padding: 20px 40px !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

.ofwi-btn-cta .wp-block-button__link:hover {
    opacity: 0.9 !important;
}

.ofwi-cta-desc {
    font-size: 15px !important;
    color: #888888 !important;
    line-height: 1.7 !important;
    margin-top: 16px !important;
}

/* =====================
   NAVIGATION
   ===================== */
.ofwi-nav {
    position: sticky !important;
    top: 0 !important;
    z-index: 100 !important;
    border-bottom: 1px solid #1f1f1f !important;
    padding: 24px 80px !important;
    background: #0a0a0a !important;
}

body.admin-bar .ofwi-nav {
    top: 32px !important;
}

@media screen and (max-width: 782px) {
    body.admin-bar .ofwi-nav {
        top: 46px !important;
    }
}

/* Secours JS : "position: sticky" ne s'engage jamais sur ce site. La classe est
   appliquée par IntersectionObserver depuis functions.php, avec le décalage "top"
   calculé dynamiquement (variable --ofwi-sticky-top) pour s'adapter à chaque élément
   concerné (menu principal, barre de filtres des réalisations en dessous, etc.). */
.js-sticky--stuck {
    position: fixed !important;
    top: var(--ofwi-sticky-top, 0px) !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
}

.ofwi-nav .wp-block-columns {
    align-items: center !important;
    margin: 0 !important;
}

.ofwi-logo {
    font-size: 22px !important;
    font-weight: 900 !important;
    letter-spacing: -1px !important;
    line-height: 1.2 !important;
    color: #ffffff !important;
    margin: 0 !important;
}

.ofwi-logo-sub {
    font-size: 10px !important;
    font-weight: 400 !important;
    color: #888888 !important;
    letter-spacing: 3px !important;
}

.ofwi-nav .wp-block-navigation,
.ofwi-nav .wp-block-navigation__responsive-container-content,
.ofwi-nav .wp-block-navigation__container {
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
    justify-content: center !important;
}

.ofwi-nav .wp-block-navigation .wp-block-navigation-item {
    white-space: nowrap !important;
}

.ofwi-nav .wp-block-navigation a {
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    opacity: 0.85 !important;
    white-space: nowrap !important;
}

.ofwi-nav .wp-block-navigation a:hover {
    opacity: 1 !important;
    color: #F5C518 !important;
    text-decoration: underline !important;
}

/* Sous-menu déroulant */
/* Le panneau visible est un ::before positionné plus bas (sous toute la barre de nav),
   pendant que le conteneur réel reste collé au lien déclencheur (padding, pas margin) :
   ça garde une zone de survol continue entre le lien et le sous-menu, sinon le survol
   se coupe dans l'espace vide et on ne peut plus cliquer dedans sans repasser par la flèche. */
.ofwi-nav .wp-block-navigation__submenu-container {
    position: absolute !important;
    top: 100% !important;
    margin-top: 0 !important;
    padding: 40px 6px 6px !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    min-width: 200px !important;
}

.ofwi-nav .wp-block-navigation__submenu-container::before {
    content: '' !important;
    position: absolute !important;
    top: 40px !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: #111111 !important;
    border: 1px solid #1f1f1f !important;
    box-shadow: 0 16px 32px rgba(0, 0, 0, 0.4) !important;
    z-index: -1 !important;
}

.ofwi-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    opacity: 0.85 !important;
    border-radius: 8px !important;
    padding: 10px 12px !important;
    text-decoration: none !important;
    transition: background-color 0.15s, color 0.15s !important;
}

.ofwi-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
    background-color: #1a1a1a !important;
    color: #F5C518 !important;
    opacity: 1 !important;
    text-decoration: none !important;
}

.ofwi-nav .wp-block-navigation .has-child > .wp-block-navigation-item__content .wp-block-navigation__submenu-icon {
    opacity: 0.7 !important;
}

.ofwi-nav-cta .wp-block-button__link {
    background: #F5C518 !important;
    color: #0a0a0a !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    border-radius: 999px !important;
}

.ofwi-nav-cta .wp-block-button__link:hover {
    opacity: 0.9 !important;
}

/* =====================
   FIL D'ARIANE
   ===================== */
.ofwi-breadcrumb {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding: 20px 80px !important;
    box-sizing: border-box !important;
}

.ofwi-breadcrumb-inner {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #888888 !important;
}

.ofwi-breadcrumb-inner a {
    color: #888888 !important;
    text-decoration: none !important;
    transition: color 0.2s !important;
}

.ofwi-breadcrumb-inner a:hover {
    color: #F5C518 !important;
}

.ofwi-breadcrumb-inner span[aria-current="page"] {
    color: #ffffff !important;
}

.ofwi-breadcrumb-sep {
    color: #444444 !important;
}

/* =====================
   DISPONIBILITÉ
   ===================== */
.ofwi-disponibilite {
    padding: 60px 80px !important;
    border-top: 1px solid #1f1f1f !important;
}

.ofwi-dot {
    width: 12px !important;
    height: 12px !important;
    border-radius: 50% !important;
    background: #22c55e !important;
    box-shadow: 0 0 10px #22c55e88 !important;
    animation: pulse 2s infinite !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
    font-size: 0 !important;
}

@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}

.ofwi-dispo-titre {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    margin: 0 !important;
}

.ofwi-dispo-sub {
    font-size: 13px !important;
    color: #888888 !important;
    margin: 2px 0 0 !important;
}

.ofwi-dispo-delai {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    margin: 0 !important;
}

.ofwi-dispo-horaires {
    font-size: 14px !important;
    color: #888888 !important;
    margin: 2px 0 0 !important;
}

/* =====================
   FAQ
   ===================== */
.ofwi-faq {
    padding: 80px !important;
    border-top: 1px solid #1f1f1f !important;
}

.ofwi-faq h2 {
    font-size: 36px !important;
    font-weight: 900 !important;
    letter-spacing: -1px !important;
    margin-bottom: 40px !important;
    color: #ffffff !important;
}

.ofwi-faq details {
    border-bottom: 1px solid #1f1f1f !important;
    padding: 28px 0 !important;
}

.ofwi-faq details:first-of-type {
    border-top: 1px solid #1f1f1f !important;
}

.ofwi-faq details summary {
    font-size: 17px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    cursor: pointer !important;
    list-style: none !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

.ofwi-faq details summary::-webkit-details-marker {
    display: none !important;
}

.ofwi-faq details summary::after {
    content: '+' !important;
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    border: 1px solid #2a2a2a !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 18px !important;
    color: #F5C518 !important;
    flex-shrink: 0 !important;
    transition: transform 0.2s !important;
}

.ofwi-faq details[open] summary::after {
    content: '−' !important;
}

.ofwi-faq details p {
    font-size: 15px !important;
    color: #888888 !important;
    line-height: 1.7 !important;
    margin-top: 16px !important;
}

/* =====================
   CONTACT
   ===================== */
.ofwi-contact-label {
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    color: #F5C518 !important;
    margin: 0 0 16px !important;
}

.ofwi-contact-info {
    font-size: 16px !important;
    color: #cccccc !important;
    line-height: 1.8 !important;
    margin: 0 0 48px !important;
}

.ofwi-contact-info a {
    color: #cccccc !important;
    text-decoration: none !important;
}

.ofwi-contact-info a:hover {
    color: #F5C518 !important;
}

.ofwi-contact-lieu {
    font-size: 14px !important;
    color: #888888 !important;
}

.ofwi-social {
    font-size: 15px !important;
    color: #cccccc !important;
    background: #1a1a1a !important;
    padding: 14px 18px !important;
    border-radius: 12px !important;
    margin: 0 0 12px !important;
}

.ofwi-social-handle {
    font-size: 12px !important;
    color: #888888 !important;
    float: right !important;
}

.ofwi-contact-form {
    background: #111111 !important;
}

.ofwi-contact-form h3 {
    font-size: 28px !important;
    font-weight: 900 !important;
    letter-spacing: -0.5px !important;
    margin-bottom: 8px !important;
    color: #ffffff !important;
}

.ofwi-form-subtitle {
    font-size: 14px !important;
    color: #888888 !important;
    margin-bottom: 48px !important;
}

.ofwi-form-placeholder {
    border: 1px dashed #2a2a2a !important;
    border-radius: 12px !important;
    padding: 40px !important;
    text-align: center !important;
    color: #555555 !important;
    font-size: 13px !important;
}

.ofwi-expertises-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 48px !important;
}

.ofwi-expertises-list li {
    font-size: 14px !important;
    color: #cccccc !important;
    line-height: 2 !important;
    padding-left: 20px !important;
    position: relative !important;
}

.ofwi-expertises-list li::before {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    background: #F5C518 !important;
}

/* =====================
   RÉALISATIONS HERO
   ===================== */
.ofwi-realisations-hero {
    padding: 80px 80px 60px !important;
    border-bottom: 1px solid #1f1f1f !important;
}

.ofwi-realisations-hero h1 {
    font-size: clamp(40px, 6vw, 72px) !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: -3px !important;
    color: #ffffff !important;
}

.ofwi-realisations-count {
    font-size: 32px !important;
    font-weight: 900 !important;
    letter-spacing: -1px !important;
    color: #ffffff !important;
    margin: 0 0 4px !important;
}

.ofwi-realisations-count-label {
    font-size: 15px !important;
    color: #888888 !important;
    max-width: 300px !important;
    margin: 0 !important;
}

.ofwi-realisations-hero .ofwi-label {
    color: #F5C518 !important;
    text-transform: uppercase !important;
    letter-spacing: 3px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
}

.ofwi-realisations-hero .wp-block-column:last-child {
    text-align: right !important;
}

.ofwi-realisations-hero .wp-block-column:last-child .wp-block-paragraph {
    text-align: right !important;
    margin-left: auto !important;
}

/* =====================
   FOOTER
   ===================== */
.ofwi-footer {
    padding: 60px 80px 40px !important;
    border-top: 1px solid #1f1f1f !important;
    background: #0a0a0a !important;
}

.ofwi-footer .wp-block-columns {
    margin-bottom: 48px !important;
}

.ofwi-footer-logo {
    font-size: 22px !important;
    font-weight: 900 !important;
    letter-spacing: -1px !important;
    line-height: 1.2 !important;
    color: #ffffff !important;
    margin: 0 0 16px !important;
}

.ofwi-footer-logo-sub {
    font-size: 10px !important;
    font-weight: 400 !important;
    color: #888888 !important;
    letter-spacing: 3px !important;
}

.ofwi-footer-baseline {
    font-size: 13px !important;
    color: #888888 !important;
    line-height: 1.7 !important;
    margin: 0 !important;
}

.ofwi-footer-title {
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    color: #ffffff !important;
    margin: 0 0 20px !important;
}

.ofwi-footer-link {
    margin: 0 0 12px !important;
}

.ofwi-footer-link a {
    font-size: 14px !important;
    color: #888888 !important;
    text-decoration: none !important;
}

.ofwi-footer-link a:hover {
    color: #F5C518 !important;
}

.ofwi-footer-social-icons {
    display: flex !important;
    gap: 12px !important;
    margin: 0 !important;
}

.ofwi-footer-social-icon {
    width: 44px !important;
    height: 44px !important;
    background: #1a1a1a !important;
    border-radius: 10px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    transition: background 0.2s !important;
    color: #888888 !important;
}

.ofwi-footer-social-icon:hover {
    background: #2a2a2a !important;
    color: #F5C518 !important;
}

.ofwi-footer-social-icons .icon-container {
    text-decoration: none !important;
    transition: background-color 0.2s, color 0.2s !important;
}

.ofwi-footer-social-icons .icon-container:hover {
    background-color: #2a2a2a !important;
    color: #F5C518 !important;
    transform: none !important;
}

.ofwi-footer-bottom {
    border-top: 1px solid #1f1f1f !important;
    padding-top: 24px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

.ofwi-footer-copy {
    font-size: 12px !important;
    color: #888888 !important;
    margin: 0 !important;
}

.ofwi-footer-copy a {
    color: #888888 !important;
    text-decoration: none !important;
}

.ofwi-footer-copy a:hover {
    color: #F5C518 !important;
}

.ofwi-footer-logo-img {
    max-width: 160px !important;
    margin: 0 0 16px !important;
}

.ofwi-footer-logo-img img {
    max-width: 160px !important;
    height: auto !important;
}

.ofwi-footer .wp-block-columns .wp-block-column:nth-child(2) {
    padding-left: 60px !important;
}

/* =====================
   INTRO CITATION
   ===================== */
.ofwi-intro {
    padding: 100px 80px !important;
    border-bottom: 1px solid #1f1f1f !important;
}

.ofwi-intro-tag {
    display: inline-block !important;
    background: #F5C518 !important;
    color: #0a0a0a !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    padding: 6px 14px !important;
    border-radius: 999px !important;
    margin-bottom: 28px !important;
}

.ofwi-intro h2 {
    font-size: 42px !important;
    font-weight: 900 !important;
    letter-spacing: -1.5px !important;
    line-height: 1.1 !important;
    color: #ffffff !important;
}

.ofwi-intro-body {
    border-left: 3px solid #F5C518 !important;
    padding-left: 32px !important;
}

.ofwi-intro-body p {
    color: #cccccc !important;
    font-size: 17px !important;
    line-height: 1.8 !important;
    margin-bottom: 18px !important;
}

.ofwi-intro-body p:last-child {
    margin-bottom: 0 !important;
}

/* =====================
   PILIERS
   ===================== */
.ofwi-piliers {
    padding: 90px 80px 100px !important;
    border-bottom: 1px solid #1f1f1f !important;
}

.ofwi-piliers h2 {
    font-size: 48px !important;
    font-weight: 900 !important;
    letter-spacing: -1.8px !important;
    line-height: 1.05 !important;
    color: #ffffff !important;
}

.ofwi-piliers .ofwi-label {
    color: #F5C518 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    margin-bottom: 20px !important;
    display: block !important;
}

.ofwi-piliers .wp-block-columns:first-of-type {
    margin-bottom: 60px !important;
    align-items: flex-end !important;
}

.ofwi-piliers-desc {
    color: #888888 !important;
    font-size: 15px !important;
    line-height: 1.7 !important;
    text-align: right !important;
    max-width: 380px !important;
    margin-left: auto !important;
}

.ofwi-piliers .wp-block-columns:not(:first-of-type) {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
    gap: 24px !important;
}

.ofwi-pilier-card {
    background: #1a1a1a !important;
    border-radius: 16px !important;
    padding: 40px 36px !important;
    position: relative !important;
    height: 100% !important;
}

.ofwi-pilier-counter {
    position: absolute !important;
    top: 24px !important;
    right: 28px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #888888 !important;
    letter-spacing: 2px !important;
    margin: 0 !important;
}

.ofwi-pilier-icon {
    width: 56px !important;
    height: 56px !important;
    background: #F5C518 !important;
    border-radius: 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 0 28px 0 !important;
    font-size: 24px !important;
    line-height: 1 !important;
    padding: 0 !important;
}

.ofwi-pilier-card .wp-block-paragraph.ofwi-pilier-icon {
    display: flex !important;
    width: 56px !important;
    height: 56px !important;
    background: #F5C518 !important;
    color: #0a0a0a;
    border-radius: 14px !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 0 28px 0 !important;
    font-size: 24px !important;
    line-height: 1 !important;
    padding: 0 !important;
    text-align: center !important;
}

.ofwi-pilier-card h3 {
    font-size: 22px !important;
    font-weight: 800 !important;
    letter-spacing: -0.5px !important;
    line-height: 1.2 !important;
    color: #ffffff !important;
    margin-bottom: 14px !important;
}

.ofwi-pilier-desc {
    color: #888888 !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
    margin-bottom: 24px !important;
}

.ofwi-pilier-objective {
    border-top: 1px solid #2a2a2a !important;
    padding-top: 20px !important;
    display: flex !important;
    gap: 12px !important;
    align-items: flex-start !important;
}

.ofwi-pilier-objective-label {
    font-size: 10px !important;
    font-weight: 800 !important;
    color: #F5C518 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
    padding-top: 2px !important;
}

.ofwi-pilier-objective-text {
    font-size: 13px !important;
    color: #cccccc !important;
    line-height: 1.6 !important;
    margin: 0 !important;
}

/* =====================
   TARIFS
   ===================== */
.ofwi-tarifs {
    padding: 100px 80px !important;
    border-bottom: 1px solid #1f1f1f !important;
}

.ofwi-tarifs-header {
    margin-bottom: 60px !important;
    text-align: center !important;
    max-width: 900px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.ofwi-tarifs-label,
.ofwi-tarifs-header .ofwi-label {
    color: #F5C518 !important;
    text-align: center !important;
    text-transform: none !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    display: block !important;
}

.ofwi-tarifs-label,
.ofwi-tarifs-header .ofwi-label,
.ofwi-tarifs-header .wp-block-paragraph.ofwi-label {
    color: #F5C518 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 3px !important;
    display: block !important;
    margin-bottom: 16px !important;
}

.ofwi-tarifs-header h2,
.ofwi-tarifs-header .wp-block-heading {
    font-size: 48px !important;
    font-weight: 900 !important;
    letter-spacing: -1.8px !important;
    line-height: 1.05 !important;
    color: #ffffff !important;
    text-align: center !important;
    margin-top: 0 !important;
    margin-bottom: 16px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.ofwi-tarifs-header h2 {
    font-size: 48px !important;
    font-weight: 900 !important;
    letter-spacing: -1.8px !important;
    line-height: 1.05 !important;
    color: #ffffff !important;
    text-align: left !important;
    margin-top: 16px !important;
    margin-bottom: 16px !important;
}

.ofwi-tarifs-intro {
    font-size: 16px !important;
    color: #888888 !important;
    line-height: 1.7 !important;
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.ofwi-tarif-card {
    background: #1a1a1a !important;
    border-radius: 20px !important;
    padding: 48px 44px !important;
    border: 1px solid #1f1f1f !important;
    position: relative !important;
    height: 100% !important;
}

.ofwi-tarif-card--featured {
    border-color: #F5C518 !important;
    background: linear-gradient(180deg, #1a1a1a 0%, #161616 100%) !important;
}

.ofwi-tarif-badge {
    position: absolute !important;
    top: -12px !important;
    left: 44px !important;
    background: #F5C518 !important;
    color: #0a0a0a !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    padding: 6px 14px !important;
    border-radius: 999px !important;
    margin: 0 !important;
    display: inline-block !important;
}

.ofwi-tarif-name {
    font-size: 14px !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    color: #888888 !important;
    margin-bottom: 16px !important;
}

.ofwi-tarif-audience {
    font-size: 26px !important;
    font-weight: 800 !important;
    letter-spacing: -0.5px !important;
    line-height: 1.25 !important;
    color: #ffffff !important;
    margin-bottom: 36px !important;
}

.ofwi-tarif-audience-highlight {
    color: #F5C518 !important;
}

.ofwi-tarif-price-row {
    display: flex !important;
    align-items: baseline !important;
    gap: 10px !important;
    margin-bottom: 8px !important;
}

.ofwi-tarif-from {
    font-size: 13px !important;
    color: #888888 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}

.ofwi-tarif-value {
    font-size: 56px !important;
    font-weight: 900 !important;
    letter-spacing: -2px !important;
    color: #ffffff !important;
    line-height: 1 !important;
}

.ofwi-tarif-ttc {
    font-size: 14px !important;
    color: #888888 !important;
    font-weight: 600 !important;
}

.ofwi-tarif-divider-line {
    height: 1px !important;
    background: #2a2a2a !important;
    margin: 32px 0 !important;
    padding: 0 !important;
}

.ofwi-tarif-features {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
}

.ofwi-tarif-features li {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    font-size: 14px !important;
    color: #cccccc !important;
    line-height: 1.5 !important;
    padding: 0 !important;
}

.ofwi-tarif-features li::before {
    content: '✓' !important;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    background: #F5C518 !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    color: #0a0a0a !important;
    margin-top: 1px !important;
}

.ofwi-tarif-sep {
    border-color: #2a2a2a !important;
    margin: 32px 0 !important;
    border-top-width: 1px !important;
}

/* =====================
   OFFRE PREMIUM
   ===================== */
.ofwi-premium {
    padding: 100px 80px !important;
    border-bottom: 1px solid #1f1f1f !important;
    background: #111111 !important;
}

.ofwi-premium .wp-block-columns:first-of-type {
    margin-bottom: 60px !important;
    align-items: flex-end !important;
}

.ofwi-premium .wp-block-columns:last-of-type {
    align-items: stretch !important;
}

.ofwi-premium .wp-block-columns:last-of-type .wp-block-column {
    display: flex !important;
    flex-direction: column !important;
}

.ofwi-premium-tag {
    display: inline-block !important;
    background: #F5C518 !important;
    color: #0a0a0a !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    padding: 6px 14px !important;
    border-radius: 999px !important;
    margin-bottom: 24px !important;
}

.ofwi-premium h2 {
    font-size: 42px !important;
    font-weight: 900 !important;
    letter-spacing: -1.5px !important;
    line-height: 1.1 !important;
    color: #ffffff !important;
}

.ofwi-premium-desc {
    color: #888888 !important;
    font-size: 16px !important;
    line-height: 1.8 !important;
}

.ofwi-premium-item .wp-block-html {
    background: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    flex-shrink: 0 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
}

.ofwi-premium-item .wp-block-html > * {
    background: none !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 48px !important;
    height: 48px !important;
}

.ofwi-premium-item.wp-block-group {
    gap: 20px !important;
}

/* COLONNE GAUCHE — FEATURES */
.ofwi-premium-features {
    background: #1a1a1a !important;
    border-radius: 16px !important;
    padding: 40px !important;
    flex: 1 !important;
}

.ofwi-premium-features h3 {
    font-size: 20px !important;
    font-weight: 800 !important;
    color: #F5C518 !important;
    margin-bottom: 32px !important;
    text-align: left !important;
}

.ofwi-premium-item {
    padding: 16px 0 !important;
    display: flex !important;
    flex-direction: row !important;
    gap: 16px !important;
    align-items: flex-start !important;
}

.ofwi-premium-item .wp-block-outermost-icon-block {
    flex-shrink: 0 !important;
}

.ofwi-premium-item:last-child {
    border-bottom: none !important;
    padding-bottom: 0 !important;
}

.ofwi-premium-item-icon {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    background: #0e0e0e !important;
    border: 1px solid #2a2a2a !important;
    border-radius: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
    padding: 12px !important;
    line-height: 0 !important;
    box-sizing: border-box !important;
}

.ofwi-premium-item-icon svg {
    width: 22px !important;
    height: 22px !important;
    display: block !important;
    flex-shrink: 0 !important;
    min-width: 22px !important;
}

.ofwi-premium-item .wp-block-html {
    background: none !important;
    padding: 0 !important;
    margin: 0 !important;
    line-height: 0 !important;
}

.ofwi-premium-item h4 {
    font-size: 17px !important;
    font-weight: 800 !important;
    letter-spacing: -0.3px !important;
    color: #ffffff !important;
    margin-bottom: 6px !important;
    text-align: left !important;
}

.ofwi-premium-item p {
    font-size: 14px !important;
    color: #aaaaaa !important;
    line-height: 1.7 !important;
    text-align: left !important;
}

/* COLONNE DROITE — CARTE PRIX */
.ofwi-premium-price {
    background: linear-gradient(160deg, #F5C518 0%, #d9ae00 100%) !important;
    border-radius: 20px !important;
    padding: 48px 44px !important;
    color: #0a0a0a !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    gap: 0 !important;    position: relative !important;
    overflow: hidden !important;
    min-height: 540px !important;
    flex: 1 !important;
}

.ofwi-premium-price::before {
    content: '' !important;
    position: absolute !important;
    top: -100px !important;
    right: -100px !important;
    width: 300px !important;
    height: 300px !important;
    background: rgba(0,0,0,0.06) !important;
    border-radius: 50% !important;
    pointer-events: none !important;
}

.ofwi-premium-price-label {
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    color: #0a0a0a !important;
    opacity: 0.7 !important;
    margin-bottom: 14px !important;
    text-align: left !important;
}

.ofwi-premium-price h3,
.ofwi-premium-price .wp-block-heading,
.wp-block-group.ofwi-premium-price .wp-block-heading {
    font-size: 38px !important;
    font-weight: 900 !important;
    letter-spacing: -1.5px !important;
    line-height: 1.05 !important;
    color: #0a0a0a !important;
    margin-bottom: 18px !important;
    text-align: left !important;
    margin-left: 0 !important;
}

.ofwi-premium-price-desc {
    font-size: 14px !important;
    line-height: 1.7 !important;
    color: #0a0a0a !important;
    opacity: 0.8 !important;
    text-align: left !important;
    margin-bottom: 0 !important;
}

.ofwi-premium-price .wp-block-paragraph.ofwi-premium-from {
    margin-top: auto !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    color: #0a0a0a !important;
    opacity: 0.7 !important;
    margin-bottom: 6px !important;
}

.ofwi-premium-amount {
    display: flex !important;
    align-items: baseline !important;
    gap: 8px !important;
    margin-top: auto !important;
    margin-bottom: 16px !important;
}

.ofwi-premium-value {
    font-size: 72px !important;
    font-weight: 900 !important;
    color: #0a0a0a !important;
    letter-spacing: -3px !important;
    line-height: 1 !important;
}

.ofwi-premium-ttc {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #0a0a0a !important;
    opacity: 0.7 !important;
}

.ofwi-premium-scope {
    font-size: 13px !important;
    color: #0a0a0a !important;
    opacity: 0.7 !important;
    line-height: 1.6 !important;
    margin-bottom: 28px !important;
    text-align: left !important;
}

.ofwi-premium-price .wp-block-paragraph,
.ofwi-premium-price p {
    text-align: left !important;
    color: #0a0a0a !important;
    margin-top: 0 !important;
    margin-bottom: 8px !important;
    margin-left: 0 !important;
}

.ofwi-premium-price .wp-block-buttons {
    margin-top: auto !important;
}

.ofwi-btn-premium .wp-block-button__link {
    background: #0a0a0a !important;
    color: #F5C518 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    padding: 18px 28px !important;
    border-radius: 999px !important;
    width: 100% !important;
    text-align: center !important;
    display: block !important;
}

.ofwi-premium-features .wp-block-separator {
    display: none !important;
}

.ofwi-premium-price .wp-block-heading {
    margin-top: 8px !important;
    margin-bottom: 12px !important;
}

.ofwi-premium-price-label {
    margin-bottom: 8px !important;
}

.ofwi-premium-price-desc {
    margin-bottom: 0 !important;
}


/* =====================
   CONCEPTS
   ===================== */
.ofwi-concepts {
    padding: 100px 80px !important;
    border-bottom: 1px solid #1f1f1f !important;
}

.ofwi-concepts-header {
    margin-bottom: 60px !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
}

.ofwi-concepts-header h2 {
    font-size: 42px !important;
    font-weight: 900 !important;
    letter-spacing: -1.5px !important;
    line-height: 1.1 !important;
    color: #ffffff !important;
    margin-top: 16px !important;
    text-align: left !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
}

.ofwi-concepts-header .ofwi-label {
    text-align: left !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
    color: #F5C518 !important;
}

.ofwi-concept-card {
    background: #1a1a1a !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    padding: 0 !important;
}

.ofwi-concept-image {
    margin: 0 !important;
    display: block !important;
}

.ofwi-concept-image img {
    width: 100% !important;
    aspect-ratio: 9/16 !important;
    object-fit: cover !important;
    display: block !important;
    border-bottom: 2px solid #F5C518 !important;
    border-radius: 0 !important;
    margin: 0 !important;
}

.ofwi-concept-infos {
    padding: 25px !important;
}

.ofwi-concept-card h4 {
    font-size: 16px !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    margin-bottom: 8px !important;
}

.ofwi-concept-card p {
    font-size: 13px !important;
    color: #888888 !important;
    line-height: 1.6 !important;
    margin: 0 !important;
}

/* =====================
   PROCESS
   ===================== */
.ofwi-process {
    padding: 100px 80px !important;
    border-bottom: 1px solid #1f1f1f !important;
}

.ofwi-process-header {
    margin-bottom: 60px !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
}

.ofwi-process-label,
.ofwi-process-header .ofwi-label {
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    color: #F5C518 !important;
    margin-bottom: 20px !important;
    display: block !important;
    text-align: left !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
}

.ofwi-process-header .wp-block-heading,
.ofwi-process-header h2 {
    font-size: 42px !important;
    font-weight: 900 !important;
    letter-spacing: -1.5px !important;
    line-height: 1.05 !important;
    color: #ffffff !important;
    text-align: left !important;
    margin-top: 16px !important;
    margin-left: 0 !important;
}

.ofwi-process-steps {
    border-radius: 16px !important;
    overflow: hidden !important;
}

.ofwi-process-steps .wp-block-columns {
    gap: 0 !important;
    margin: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
    background: #1f1f1f !important;
}

.ofwi-process-steps .wp-block-column {
    padding: 0 !important;
    margin: 0 !important;
    min-width: 0 !important;
}

.ofwi-process-step {
    background: #1a1a1a !important;
    padding: 40px 32px !important;
    height: 100% !important;
    margin: 0 !important;
    border: none !important;
    border-top: none !important;
}

.ofwi-process-num,
.ofwi-process-step .wp-block-paragraph.ofwi-process-num {
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 2px !important;
    color: #F5C518 !important;
    margin-bottom: 24px !important;
    display: block !important;
}

.ofwi-process-step h4,
.ofwi-process-step .wp-block-heading {
    font-size: 18px !important;
    font-weight: 800 !important;
    letter-spacing: -0.3px !important;
    color: #ffffff !important;
    margin-bottom: 12px !important;
    text-align: left !important;
}

.ofwi-process-step p,
.ofwi-process-step .wp-block-paragraph {
    font-size: 13px !important;
    color: #888888 !important;
    line-height: 1.6 !important;
    text-align: left !important;
}

:root :where(.ofwi-process-steps .is-layout-flex) {
    gap: 2px !important;
}

.ofwi-process-steps .wp-block-column + .wp-block-column .ofwi-process-step {
    border-left: 2px solid #1f1f1f !important;
}

/* =====================
   RÉALISATIONS SHORTCODE
   ===================== */
.ofwi-realisations {
    background: #0a0a0a !important;
}

.ofwi-filtres-sticky {
    z-index: 99 !important;
    background: #0a0a0a !important;
    border-bottom: 1px solid #1f1f1f !important;
}

.ofwi-filtres {
    display: flex !important;
    overflow-x: auto !important;
    padding: 0 80px !important;
    gap: 0 !important;
}

.ofwi-filtre {
    padding: 20px 28px !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    background: none !important;
    border: none !important;
    border-bottom: 2px solid transparent !important;
    color: #888888 !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    transition: color 0.2s !important;
}

.ofwi-filtre.active {
    color: #F5C518 !important;
    border-bottom-color: #F5C518 !important;
}

.ofwi-filtre-count {
    font-size: 10px !important;
    padding: 2px 7px !important;
    border-radius: 999px !important;
    background: #1f1f1f !important;
    color: #888888 !important;
    font-weight: 600 !important;
}

.ofwi-filtre.active .ofwi-filtre-count {
    background: #F5C518 !important;
    color: #0a0a0a !important;
}

.ofwi-grille {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 24px !important;
    padding: 60px 80px !important;
    background: #0a0a0a !important;
}

.ofwi-carte {
    background: #1a1a1a !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    cursor: pointer !important;
    transition: transform 0.2s, opacity 0.2s !important;
}

.ofwi-carte:hover {
    transform: translateY(-4px) !important;
    opacity: 0.9 !important;
}

.ofwi-carte-media {
    position: relative !important;
    overflow: hidden !important;
    aspect-ratio: 16/9 !important;
    background: #222222 !important;
}

.ofwi-carte-media img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

.ofwi-carte-media::after {
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 2px !important;
    background: #F5C518 !important;
}

.ofwi-carte-placeholder {
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #444444 !important;
    font-size: 13px !important;
}

.ofwi-carte-play {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 52px !important;
    height: 52px !important;
    background: #F5C518 !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 2 !important;
    transition: transform 0.2s, background 0.2s !important;
}

.ofwi-carte-play svg {
    width: 20px !important;
    height: 20px !important;
}

.ofwi-carte-play svg circle {
    display: none !important;
}

.ofwi-carte-play svg path {
    fill: #0a0a0a !important;
}

.ofwi-carte:hover .ofwi-carte-play {
    transform: translate(-50%, -50%) scale(1.1) !important;
    background: #ffffff !important;
}

.ofwi-carte-duree {
    position: absolute !important;
    bottom: 16px !important;
    right: 16px !important;
    background: rgba(0,0,0,0.8) !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    padding: 4px 8px !important;
    border-radius: 4px !important;
}

.ofwi-carte-infos {
    padding: 20px 24px !important;
}

.ofwi-carte-label {
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    color: #F5C518 !important;
    margin-bottom: 8px !important;
}

.ofwi-carte-titre {
    font-size: 16px !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    line-height: 1.3 !important;
    margin: 0 0 10px !important;
}

.ofwi-carte-bottom {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin-top: 8px !important;
}

.ofwi-carte-role {
    font-size: 11px !important;
    color: #888888 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}

.ofwi-carte-duree-text {
    font-size: 11px !important;
    color: #888888 !important;
    letter-spacing: 0.5px !important;
}

.ofwi-carte-duree-text::before {
    content: '·' !important;
    margin-right: 12px !important;
    color: #444444 !important;
}

/* =====================
   SECTIONS RÉALISATIONS
   ===================== */
.ofwi-section {
    padding: 80px 80px 60px !important;
    border-bottom: 1px solid #1f1f1f !important;
}

.ofwi-section-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 48px !important;
}

.ofwi-section-title {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
}

.ofwi-section-icon {
    width: 44px !important;
    height: 44px !important;
    border-radius: 10px !important;
    background: #F5C518 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 20px !important;
    flex-shrink: 0 !important;
}

.ofwi-section-title h2 {
    font-size: 28px !important;
    font-weight: 900 !important;
    letter-spacing: -0.5px !important;
    color: #ffffff !important;
    margin: 0 !important;
}

.ofwi-section-title p {
    font-size: 13px !important;
    color: #888888 !important;
    margin-top: 2px !important;
}


/* VIDÉO */
.ofwi-grid-video {
    display: grid !important;
    grid-template-columns: 1.6fr 1fr !important;
    grid-template-rows: auto auto !important;
    gap: 16px !important;
}

.ofwi-card-featured {
    grid-row: 1 / 3 !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    background: #1a1a1a !important;
    position: relative !important;
    min-height: 420px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    cursor: pointer !important;
}

.ofwi-card-featured img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

.ofwi-play-btn {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 64px !important;
    height: 64px !important;
    border-radius: 50% !important;
    background: rgba(245,197,24,0.15) !important;
    border: 2px solid #F5C518 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    backdrop-filter: blur(4px) !important;
    z-index: 2 !important;
}

.ofwi-card-overlay {
    position: relative !important;
    padding: 28px !important;
    background: linear-gradient(to top, rgba(0,0,0,0.95) 0%, transparent 100%) !important;
    z-index: 2 !important;
}

.ofwi-card-tag {
    display: inline-block !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    color: #F5C518 !important;
    margin-bottom: 8px !important;
}

.ofwi-card-overlay h3 {
    font-size: 22px !important;
    font-weight: 900 !important;
    letter-spacing: -0.5px !important;
    color: #ffffff !important;
    margin: 0 0 4px !important;
}

.ofwi-card-overlay p {
    font-size: 13px !important;
    color: #aaaaaa !important;
    margin: 0 !important;
}

.ofwi-card-small {
    border-radius: 16px !important;
    background: #1a1a1a !important;
    overflow: hidden !important;
    cursor: pointer !important;
    transition: transform 0.2s !important;
}

.ofwi-card-small:hover {
    transform: translateY(-4px) !important;
}

.ofwi-card-small-thumb {
    height: 180px !important;
    position: relative !important;
    overflow: hidden !important;
    background: #222222 !important;
}

.ofwi-card-small-thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

.ofwi-play-btn-sm {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    background: rgba(245,197,24,0.15) !important;
    border: 1.5px solid #F5C518 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* MOTION DESIGN */
.ofwi-grid-motion {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 16px !important;
}

.ofwi-card-motion {
    background: #1a1a1a !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    cursor: pointer !important;
    transition: transform 0.2s !important;
}

.ofwi-card-motion:hover {
    transform: translateY(-4px) !important;
}

.ofwi-card-motion-thumb {
    aspect-ratio: 16/9 !important;
    background: #222222 !important;
    position: relative !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.ofwi-card-motion-thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

.ofwi-loop-badge {
    position: absolute !important;
    top: 12px !important;
    right: 12px !important;
    background: rgba(0,0,0,0.7) !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    padding: 4px 10px !important;
    border-radius: 999px !important;
    backdrop-filter: blur(4px) !important;
}

/* GRAPHISME */
.ofwi-grid-graphisme {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 16px !important;
}

.ofwi-card-graphisme {
    border-radius: 16px !important;
    overflow: hidden !important;
    position: relative !important;
    cursor: pointer !important;
    aspect-ratio: 1/1 !important;
    background: #1a1a1a !important;
}

.ofwi-card-graphisme--large {
    grid-column: span 2 !important;
    aspect-ratio: 2/1 !important;
}

.ofwi-card-graphisme img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform 0.3s !important;
}

.ofwi-card-graphisme:hover img {
    transform: scale(1.05) !important;
}

.ofwi-card-graphisme-overlay {
    position: absolute !important;
    inset: 0 !important;
    background: rgba(0,0,0,0.7) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 0 !important;
    transition: opacity 0.3s !important;
    padding: 24px !important;
    text-align: center !important;
}

.ofwi-card-graphisme:hover .ofwi-card-graphisme-overlay {
    opacity: 1 !important;
}

.ofwi-card-graphisme-overlay h4 {
    font-size: 18px !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    margin-bottom: 8px !important;
}

.ofwi-card-graphisme-overlay p {
    font-size: 13px !important;
    color: #aaaaaa !important;
}

/* WEB DESIGN */
.ofwi-grid-web {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
}

.ofwi-card-web {
    background: #1a1a1a !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    cursor: pointer !important;
    transition: transform 0.2s !important;
}

.ofwi-card-web:hover {
    transform: translateY(-4px) !important;
}

.ofwi-browser-bar {
    background: #222222 !important;
    padding: 10px 16px !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    border-bottom: 1px solid #2a2a2a !important;
}

.ofwi-dot {
    width: 10px !important;
    height: 10px !important;
    border-radius: 50% !important;
}

.ofwi-dot--r { background: #ff5f57 !important; }
.ofwi-dot--y { background: #febc2e !important; }
.ofwi-dot--g { background: #28c840 !important; }

.ofwi-url-bar {
    background: #2a2a2a !important;
    border-radius: 4px !important;
    padding: 3px 12px !important;
    font-size: 11px !important;
    color: #888888 !important;
    margin-left: 8px !important;
    flex: 1 !important;
}

.ofwi-card-screen {
    height: 180px !important;
    background: #111111 !important;
    overflow: hidden !important;
}

.ofwi-card-screen img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

.ofwi-card-body--web {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

.ofwi-arrow {
    font-size: 20px !important;
    color: #F5C518 !important;
    flex-shrink: 0 !important;
}

/* CARD BODY COMMUN */
.ofwi-card-body {
    padding: 20px !important;
}

.ofwi-card-body h3 {
    font-size: 16px !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    margin: 0 0 4px !important;
}

.ofwi-card-body p {
    font-size: 12px !important;
    color: #888888 !important;
    margin: 0 !important;
}

.ofwi-card-placeholder {
    width: 100% !important;
    height: 100% !important;
    background: #222222 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #444444 !important;
    font-size: 13px !important;
}

/* GRILLE STANDARD */
.ofwi-grid-standard {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 24px !important;
}

/* =====================
   CAS PRATIQUES
   ===================== */
.ofwi-cas {
    padding: 100px 80px !important;
    border-bottom: 1px solid #1f1f1f !important;
}

.ofwi-cas .wp-block-columns:first-of-type {
    margin-bottom: 50px !important;
    align-items: flex-end !important;
}

.ofwi-cas h2 {
    font-size: 48px !important;
    font-weight: 900 !important;
    letter-spacing: -1.8px !important;
    line-height: 1.05 !important;
    color: #ffffff !important;
}

.ofwi-cas p.ofwi-label,
.ofwi-cas .wp-block-paragraph.ofwi-label {
    color: #F5C518 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
}

.ofwi-cas-desc {
    color: #888888 !important;
    font-size: 15px !important;
    line-height: 1.7 !important;
    text-align: right !important;
    max-width: 380px !important;
    margin-left: auto !important;
}

.ofwi-cas-card {
    background: #1a1a1a !important;
    border-radius: 16px !important;
    padding: 50px 44px !important;
    position: relative !important;
    overflow: hidden !important;
    border-left: 4px solid #F5C518 !important;
    height: 100% !important;
}

.ofwi-cas-card .wp-block-paragraph.ofwi-cas-num {
    font-size: 80px !important;
    font-weight: 900 !important;
    color: #F5C518 !important;
    letter-spacing: -4px !important;
    line-height: 0.9 !important;
    opacity: 0.15 !important;
    position: absolute !important;
    top: 20px !important;
    right: 30px !important;
    margin: 0 !important;
    pointer-events: none !important;
}

.ofwi-cas-label {
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    color: #F5C518 !important;
    margin-bottom: 16px !important;
    text-align: left !important;
}

.ofwi-cas-card h3,
.ofwi-cas-card h3.wp-block-heading,
.wp-block-group.ofwi-cas-card .wp-block-heading {
    font-size: 24px !important;
    font-weight: 800 !important;
    letter-spacing: -0.5px !important;
    line-height: 1.2 !important;
    color: #ffffff !important;
    margin-bottom: 20px !important;
    max-width: 80% !important;
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: auto !important;
}

.ofwi-cas-card p,
.ofwi-cas-card .wp-block-paragraph {
    color: #cccccc !important;
    font-size: 15px !important;
    line-height: 1.8 !important;
    margin-bottom: 14px !important;
    text-align: left !important;
}

.ofwi-cas-card p:last-child {
    margin-bottom: 0 !important;
}

/* =====================
   LIGHTBOX
   ===================== */
.ofwi-clickable {
    cursor: pointer !important;
}

.ofwi-lightbox {
    position: fixed !important;
    inset: 0 !important;
    z-index: 9999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity 0.3s !important;
}

.ofwi-lightbox.active {
    opacity: 1 !important;
    pointer-events: all !important;
}

.ofwi-lightbox-overlay {
    position: absolute !important;
    inset: 0 !important;
    background: rgba(0,0,0,0.92) !important;
    backdrop-filter: blur(8px) !important;
}

.ofwi-lightbox-content {
    position: relative !important;
    z-index: 2 !important;
    width: 90vw !important;
    max-width: 1000px !important;
    max-height: 90vh !important;
}

.ofwi-lightbox-close {
    position: absolute !important;
    top: -48px !important;
    right: 0 !important;
    background: none !important;
    border: none !important;
    cursor: pointer !important;
    padding: 8px !important;
    opacity: 0.7 !important;
    transition: opacity 0.2s !important;
}

.ofwi-lightbox-close:hover {
    opacity: 1 !important;
}

.ofwi-video-wrap {
    position: relative !important;
    padding-bottom: 56.25% !important;
    height: 0 !important;
    overflow: hidden !important;
    border-radius: 12px !important;
    background: #000 !important;
}

.ofwi-video-wrap iframe {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    border-radius: 12px !important;
}

.ofwi-lightbox-img {
    width: 100% !important;
    max-height: 90vh !important;
    object-fit: contain !important;
    border-radius: 12px !important;
    display: block !important;
}

/* =====================
   SERVICES
   ===================== */
.ofwi-services {
    padding: 100px 80px !important;
    border-bottom: 1px solid #1f1f1f !important;
}

.ofwi-services.alignfull {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
}

.ofwi-services-header {
    margin-bottom: 60px !important;
    padding-left: 0 !important;
}

.ofwi-services-label {
    color: #F5C518 !important;
    margin-bottom: 16px !important;
    text-align: left !important;
}

.ofwi-services-header h2 {
    font-size: 48px !important;
    font-weight: 900 !important;
    letter-spacing: -1.8px !important;
    line-height: 1.05 !important;
    color: #ffffff !important;
    text-align: left !important;
}

:root :where(.ofwi-services .is-layout-flex) {
    gap: 2px !important;
}

.ofwi-service-card {
    background: #1a1a1a !important;
    padding: 48px 40px !important;
    height: 100% !important;
    transition: background 0.2s !important;
    border-top: 2px solid transparent !important;
}

.ofwi-service-card:hover {
    background: #222222 !important;
    border-top-color: #F5C518 !important;
}

.ofwi-service-icon {
    width: 56px !important;
    height: 56px !important;
    background: #F5C518 !important;
    border-radius: 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-top: 0 !important;
    margin-bottom: 28px !important;
    margin-left: 0 !important;
    margin-right: auto !important;
}

.ofwi-service-card h3 {
    font-size: 22px !important;
    font-weight: 800 !important;
    letter-spacing: -0.5px !important;
    color: #ffffff !important;
    margin-bottom: 14px !important;
    text-align: left !important;
}

.ofwi-service-card p {
    font-size: 14px !important;
    color: #888888 !important;
    line-height: 1.7 !important;
    text-align: left !important;
}

.ofwi-service-link a {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #F5C518 !important;
    text-decoration: none !important;
    letter-spacing: 0.5px !important;
    margin-top: 8px !important;
    display: inline-block !important;
}

.ofwi-service-link a:hover {
    text-decoration: underline !important;
}

.ofwi-service-card .wp-block-html {
    background: none !important;
    padding: 0 !important;
    margin: 0 0 28px !important;
    line-height: 0 !important;
}

/* =====================
   RÉALISATIONS APERÇU
   ===================== */
.ofwi-realisations-apercu {
    padding: 100px 80px !important;
    border-bottom: 1px solid #1f1f1f !important;
}

.ofwi-realisations-apercu.alignfull {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
}

.ofwi-apercu-header {
    margin-bottom: 48px !important;
    align-items: flex-end !important;
}

.ofwi-apercu-label {
    color: #F5C518 !important;
    margin-bottom: 16px !important;
}

.ofwi-realisations-apercu h2 {
    font-size: 42px !important;
    font-weight: 900 !important;
    letter-spacing: -1.5px !important;
    line-height: 1.1 !important;
    color: #ffffff !important;
}

.ofwi-apercu-link a {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #F5C518 !important;
    text-decoration: none !important;
    border-bottom: 1px solid transparent !important;
    padding-bottom: 2px !important;
    white-space: nowrap !important;
    transition: border-color 0.2s !important;
}

.ofwi-apercu-link a:hover {
    border-bottom-color: #F5C518 !important;
}

.ofwi-apercu-grille {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 24px !important;
}

.ofwi-apercu-carte {
    background: #1a1a1a !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    transition: transform 0.2s !important;
    cursor: pointer !important;
}

.ofwi-apercu-carte:hover {
    transform: translateY(-4px) !important;
}

.ofwi-apercu-media {
    aspect-ratio: 16/9 !important;
    background: #222222 !important;
    position: relative !important;
    overflow: hidden !important;
}

.ofwi-apercu-media img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

.ofwi-apercu-media::after {
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 2px !important;
    background: #F5C518 !important;
}

.ofwi-apercu-play {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 48px !important;
    height: 48px !important;
    background: rgba(245,197,24,0.15) !important;
    border: 2px solid #F5C518 !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.ofwi-apercu-infos {
    padding: 20px 24px !important;
}

.ofwi-apercu-meta {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin-bottom: 8px !important;
}

.ofwi-apercu-cat {
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    color: #F5C518 !important;
}

.ofwi-apercu-label-type {
    font-size: 11px !important;
    color: #888888 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}

.ofwi-apercu-titre {
    font-size: 16px !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    margin-bottom: 6px !important;
    line-height: 1.3 !important;
}

.ofwi-apercu-role {
    font-size: 12px !important;
    color: #888888 !important;
    margin: 0 !important;
}

/* =====================================================
   RESPONSIVE — TABLETTE (≤ 900px)
   ===================================================== */
@media (max-width: 900px) {
    .ofwi-nav {
        padding: 20px 40px !important;
    }

    .ofwi-hero,
    .ofwi-texte-visuel,
    .ofwi-valeurs,
    .ofwi-equipe,
    .ofwi-cta,
    .ofwi-intro,
    .ofwi-piliers,
    .ofwi-tarifs,
    .ofwi-premium,
    .ofwi-concepts,
    .ofwi-process,
    .ofwi-cas,
    .ofwi-realisations-hero,
    .ofwi-footer,
    .ofwi-disponibilite,
    .ofwi-faq,
    .ofwi-breadcrumb,
    .ofwi-section {
        padding-left: 40px !important;
        padding-right: 40px !important;
    }

    .ofwi-filtres,
    .ofwi-grille {
        padding-left: 40px !important;
        padding-right: 40px !important;
    }

    .ofwi-hero .wp-block-columns {
        gap: 40px !important;
    }

    .ofwi-grid-standard,
    .ofwi-grid-motion,
    .ofwi-grid-graphisme,
    .ofwi-grid-web,
    .ofwi-grille {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .ofwi-process-steps .wp-block-columns {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* =====================================================
   RESPONSIVE — MOBILE (≤ 600px)
   ===================================================== */
@media (max-width: 600px) {

    /* ---- Rythme global ---- */
    .ofwi-hero,
    .ofwi-texte-visuel,
    .ofwi-valeurs,
    .ofwi-equipe,
    .ofwi-cta,
    .ofwi-intro,
    .ofwi-piliers,
    .ofwi-tarifs,
    .ofwi-premium,
    .ofwi-concepts,
    .ofwi-process,
    .ofwi-cas,
    .ofwi-realisations-hero,
    .ofwi-footer,
    .ofwi-disponibilite,
    .ofwi-faq,
    .ofwi-breadcrumb,
    .ofwi-section,
    .ofwi-filtres,
    .ofwi-grille {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}

/* Le menu burger doit apparaître dès 781px de large : WordPress ne le déclenche
   nativement qu'en dessous de 600px, on étend donc manuellement la bascule. */
@media (max-width: 781px) {
    .ofwi-nav .wp-block-navigation__responsive-container-open:not(.always-shown) {
        display: flex !important;
    }

    .ofwi-nav .wp-block-navigation__responsive-container:not(.is-menu-open) {
        display: none !important;
    }

    /* ---- NAVIGATION : menu burger ---- */
    .ofwi-nav {
        padding: 14px 20px !important;
    }

    .ofwi-nav .wp-block-columns {
        flex-wrap: nowrap !important;
        justify-content: space-between !important;
        align-items: center !important;
        gap: 12px !important;
    }

    /* WordPress force "flex-basis:100% !important" sur chaque colonne en dessous de 782px
       (empilement mobile natif) avec une spécificité plus forte que .ofwi-nav .wp-block-column seul :
       on ajoute .wp-block-columns pour repasser devant. */
    .ofwi-nav .wp-block-columns .wp-block-column {
        flex-basis: auto !important;
        flex-grow: 0 !important;
        width: auto !important;
    }

    .ofwi-nav .wp-block-columns .wp-block-column:first-child {
        flex-shrink: 0 !important;
    }

    .ofwi-nav .wp-block-columns .wp-block-column:nth-child(2) {
        margin-left: auto !important;
    }

    .ofwi-nav .wp-block-image {
        width: 90px !important;
        margin: 0 !important;
    }

    .ofwi-nav .wp-block-image img {
        width: 90px !important;
    }

    .ofwi-logo {
        font-size: 17px !important;
    }

    /* Le bouton CTA "bureau" disparaît : il est remplacé par l'entrée du menu mobile */
    .ofwi-nav .wp-block-column:nth-child(3) {
        display: none !important;
    }

    /* ---- Bouton hamburger : icône 3 traits dessinée en CSS (l'icône native de WordPress n'en a que 2) ---- */
    .wp-block-navigation__responsive-container-open {
        position: relative !important;
        color: #ffffff !important;
        width: 40px !important;
        height: 40px !important;
        border: none !important;
        background: transparent !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 !important;
    }

    .wp-block-navigation__responsive-container-open svg {
        display: none !important;
    }

    .wp-block-navigation__responsive-container-open::before {
        content: '' !important;
        display: block !important;
        width: 20px !important;
        height: 2px !important;
        background: #ffffff !important;
        box-shadow: 0 -6px 0 #ffffff, 0 6px 0 #ffffff !important;
    }

    /* ---- Bouton fermer ---- */
    /* Le dialogue est déjà inséré dans un conteneur qui a 32px de padding (haut/droite) :
       on retranche ces 32px pour que le X tombe au même endroit que le hamburger. */
    .wp-block-navigation__responsive-container-close {
        color: #ffffff !important;
        width: 40px !important;
        height: 40px !important;
        border: none !important;
        background: transparent !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        top: -13px !important;
        right: -12px !important;
    }

    .wp-block-navigation__responsive-container-close svg {
        stroke: #ffffff !important;
        width: 22px !important;
        height: 22px !important;
    }

    /* ---- Overlay plein écran ---- */
    .ofwi-nav .wp-block-navigation__responsive-container.is-menu-open {
        background: #0a0a0a !important;
        padding: 32px 32px 40px !important;
    }

    .ofwi-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
        align-items: stretch !important;
        justify-content: flex-start !important;
        padding-top: 64px !important;
    }

    .ofwi-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
        align-items: stretch !important;
        gap: 0 !important;
        width: 100% !important;
    }

    .ofwi-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
        width: 100% !important;
        border-bottom: 1px solid #1f1f1f !important;
        padding: 18px 0 !important;
    }

    .ofwi-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
        display: block !important;
        color: #ffffff !important;
        font-size: 24px !important;
        font-weight: 800 !important;
        letter-spacing: -0.5px !important;
        line-height: 1.2 !important;
        opacity: 1 !important;
        padding: 0 !important;
        width: 100% !important;
        white-space: normal !important;
        transition: color 0.2s !important;
    }

    .ofwi-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover,
    .ofwi-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:focus {
        color: #F5C518 !important;
        outline: none !important;
        box-shadow: none !important;
        background: none !important;
        border-color: transparent !important;
    }

    /* Dernier lien = CTA "Prêt à collaborer ?" : n'apparaît que sur mobile, sous forme de bouton */
    .ofwi-nav-mobile-cta {
        display: flex !important;
        justify-content: flex-start !important;
        border-bottom: none !important;
        margin-top: 16px !important;
        padding: 0 !important;
    }

    .ofwi-nav .wp-block-navigation__responsive-container.is-menu-open .ofwi-nav-mobile-cta .wp-block-navigation-item__content {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: auto !important;
        margin-right: auto !important;
        margin-left: 0 !important;
        background: #F5C518 !important;
        color: #0a0a0a !important;
        font-size: 15px !important;
        font-weight: 800 !important;
        letter-spacing: 0.5px !important;
        text-transform: uppercase !important;
        text-align: center !important;
        border-radius: 999px !important;
        padding: 26px 56px !important;
    }
}

@media (min-width: 782px) {
    .ofwi-nav-mobile-cta {
        display: none !important;
    }
}

@media (max-width: 600px) {
    /* ---- HERO ---- */
    .ofwi-hero {
        padding: 48px 20px !important;
    }
    .ofwi-hero .wp-block-columns {
        gap: 32px !important;
    }
    .ofwi-hero p {
        max-width: 100% !important;
    }
    .ofwi-hero-image img {
        min-height: 220px !important;
    }

    /* ---- STATS ---- */
    .ofwi-stats .wp-block-columns {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    .ofwi-stats .wp-block-column {
        padding: 32px 16px !important;
    }
    .ofwi-stats .ofwi-number {
        font-size: 36px !important;
    }

    /* ---- TEXTE + VISUEL ---- */
    .ofwi-texte-visuel {
        padding: 60px 20px !important;
    }
    .ofwi-texte-visuel h2 {
        font-size: 30px !important;
    }

    /* ---- VALEURS ---- */
    .ofwi-valeurs {
        padding: 60px 20px !important;
    }
    .ofwi-valeurs h2 {
        font-size: 30px !important;
    }
    .ofwi-valeurs .wp-block-group:first-of-type {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 16px !important;
    }
    .ofwi-valeurs .has-text-align-right {
        text-align: left !important;
    }
    .ofwi-valeurs .wp-block-columns {
        grid-template-columns: 1fr !important;
    }

    /* ---- ÉQUIPE ---- */
    .ofwi-equipe {
        padding: 60px 20px !important;
    }
    .ofwi-equipe h2 {
        font-size: 30px !important;
        margin-bottom: 32px !important;
    }

    /* ---- CTA ---- */
    .ofwi-cta {
        padding: 60px 20px !important;
    }
    .ofwi-cta .wp-block-columns {
        text-align: center !important;
    }
    .ofwi-cta .wp-block-buttons {
        justify-content: center !important;
        margin-top: 24px !important;
    }

    /* ---- DISPONIBILITÉ ---- */
    .ofwi-disponibilite {
        padding: 32px 20px !important;
    }
    .ofwi-disponibilite .wp-block-columns {
        row-gap: 20px !important;
    }

    /* ---- FAQ ---- */
    .ofwi-faq {
        padding: 48px 20px !important;
    }
    .ofwi-faq h2 {
        font-size: 28px !important;
    }
    .ofwi-faq details summary {
        font-size: 15px !important;
        gap: 12px !important;
    }

    /* ---- CONTACT ---- */
    .ofwi-contact-form {
        padding: 40px 20px !important;
    }

    /* ---- RÉALISATIONS HERO ---- */
    .ofwi-realisations-hero {
        padding: 48px 20px 40px !important;
    }
    .ofwi-realisations-hero .wp-block-column:last-child,
    .ofwi-realisations-hero .wp-block-column:last-child .wp-block-paragraph {
        text-align: left !important;
        margin-left: 0 !important;
    }

    /* ---- FOOTER ---- */
    .ofwi-footer {
        padding: 48px 20px 32px !important;
    }
    .ofwi-footer .wp-block-columns .wp-block-column:nth-child(2) {
        padding-left: 0 !important;
    }
    .ofwi-footer-bottom {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 16px !important;
    }

    /* ---- INTRO CITATION ---- */
    .ofwi-intro {
        padding: 60px 20px !important;
    }
    .ofwi-intro h2 {
        font-size: 28px !important;
    }
    .ofwi-intro-body {
        padding-left: 20px !important;
    }

    /* ---- PILIERS ---- */
    .ofwi-piliers {
        padding: 60px 20px !important;
    }
    .ofwi-piliers h2 {
        font-size: 32px !important;
    }
    .ofwi-piliers .wp-block-columns:first-of-type {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 16px !important;
    }
    .ofwi-piliers-desc {
        text-align: left !important;
        margin-left: 0 !important;
        max-width: 100% !important;
    }
    .ofwi-piliers .wp-block-columns:not(:first-of-type) {
        grid-template-columns: 1fr !important;
    }

    /* ---- TARIFS ---- */
    .ofwi-tarifs {
        padding: 60px 20px !important;
    }
    .ofwi-tarifs-header h2,
    .ofwi-tarifs-header .wp-block-heading {
        font-size: 32px !important;
    }
    .ofwi-tarif-card {
        padding: 36px 24px !important;
    }
    .ofwi-tarif-value {
        font-size: 42px !important;
    }

    /* ---- OFFRE PREMIUM ---- */
    .ofwi-premium {
        padding: 60px 20px !important;
    }
    .ofwi-premium h2 {
        font-size: 30px !important;
    }
    .ofwi-premium .wp-block-columns:first-of-type {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 16px !important;
    }
    .ofwi-premium-features,
    .ofwi-premium-price {
        padding: 28px 24px !important;
    }
    .ofwi-premium-value {
        font-size: 48px !important;
    }

    /* ---- CONCEPTS ---- */
    .ofwi-concepts {
        padding: 60px 20px !important;
    }
    .ofwi-concepts-header h2 {
        font-size: 30px !important;
    }

    /* ---- PROCESS ---- */
    .ofwi-process {
        padding: 60px 20px !important;
    }
    .ofwi-process-header .wp-block-heading,
    .ofwi-process-header h2 {
        font-size: 30px !important;
    }
    .ofwi-process-steps .wp-block-columns {
        grid-template-columns: 1fr !important;
    }
    .ofwi-process-steps .wp-block-column + .wp-block-column .ofwi-process-step {
        border-left: none !important;
        border-top: 2px solid #1f1f1f !important;
    }

    /* ---- RÉALISATIONS SHORTCODE ---- */
    /* Le décalage "top" du menu et de la barre de filtres est désormais calculé
       dynamiquement en JS (voir observe_fwi_sticky_script dans functions.php),
       plus besoin de valeurs fixes par palier ici. */
    .ofwi-grille {
        grid-template-columns: 1fr !important;
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }

    .ofwi-section {
        padding: 48px 20px 40px !important;
    }
    .ofwi-section-header {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 16px !important;
    }
    .ofwi-grid-video,
    .ofwi-grid-motion,
    .ofwi-grid-graphisme,
    .ofwi-grid-web,
    .ofwi-grid-standard {
        grid-template-columns: 1fr !important;
    }
    .ofwi-card-featured {
        min-height: 300px !important;
    }
    .ofwi-card-graphisme--large {
        grid-column: span 1 !important;
    }

    /* ---- CAS PRATIQUES ---- */
    .ofwi-cas {
        padding: 60px 20px !important;
    }
    .ofwi-cas h2 {
        font-size: 32px !important;
    }
    .ofwi-cas .wp-block-columns:first-of-type {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 16px !important;
    }
    .ofwi-cas-desc {
        text-align: left !important;
        margin-left: 0 !important;
        max-width: 100% !important;
    }
    .ofwi-cas-card {
        padding: 36px 24px !important;
    }
    .ofwi-cas-card h3,
    .ofwi-cas-card h3.wp-block-heading,
    .wp-block-group.ofwi-cas-card .wp-block-heading {
        max-width: 100% !important;
    }
}