/* ══ COMPOSANTS PARTAGÉS SKURIA ════════════════════════════════
   Tous les composants réutilisés sur plusieurs pages.
   Classes sk-* et svc-* inchangées = transparence visuelle garantie.
═══════════════════════════════════════════════════════════════ */

/* ── BADGES & LABELS ──────────────────────────────────────── */

.sk-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: .45rem !important;
    background: var(--sk-pk-a) !important;
    border: 1px solid rgba(0, 166, 180, .2);
    color: var(--sk-pk) !important;
    padding: .32rem .95rem;
    border-radius: 2rem;
    font-size: .78rem !important;
    font-weight: 600 !important;
    width: fit-content !important;
    white-space: nowrap !important;
}

.sk-badge p {
    margin: 0;
    display: inline-flex;
    align-items: center;
    width: auto !important;
    gap: 8px;
}

.sk-label {
    display: block;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--sk-pk);
    margin-bottom: .65rem;
}

/* ── BACKGROUNDS HALO ─────────────────────────────────────── */

.sk-halo-dark {
    background: var(--sk-nv) !important;

}

.sk-halo-dark::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 50% 80% at 110% 40%, rgba(0, 166, 180, .18), transparent 55%),
        radial-gradient(ellipse 35% 55% at -5% 80%, rgba(0, 166, 180, .07), transparent 50%);
    pointer-events: none;
    z-index: 1;
}

.sk-halo-dark::after {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, .025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .025) 1px, transparent 1px);
    background-size: 52px 52px;
    pointer-events: none;
    z-index: 1;
}

/* Hero page d'accueil : sert une version bien plus légère sur mobile
   (l'attribut natif de fond du bloc Group ne varie pas par device). */
@media (max-width: 600px) {
    .sk-hero-home {
        background-image: url('/wp-content/themes/skuria-blocks/assets/img/hero-home-mobile.webp') !important;
    }
}

/* Bandeau chiffres clés : chevauche le bas du hero (~2/3 sur la photo,
   ~1/3 sur la section blanche suivante). Sorti du hero pour ne pas être
   contraint par ses bords, remonté via une marge négative + z-index. */
.sk-hero-stats {
    position: relative;
    z-index: 5;
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: -63px !important;
}

@media (max-width: 1240px) {
    .sk-hero-stats {
        max-width: calc(100% - 3rem) !important;
    }
}

@media (max-width: 768px) {
    .sk-hero-stats {
        margin-top: -40px !important;
    }
}

/* Cartes "Nos expertises" : hauteur égale + "En savoir plus" toujours
   ancré en bas, quelle que soit la longueur du titre/texte au-dessus. */
.sk-expertise-card {
    display: flex !important;
    flex-direction: column;
}

.sk-expertise-card > :last-child {
    margin-top: auto !important;
}

/* Cartes secteurs d'activité (page d'accueil) : photo posée nativement
   via style.background.backgroundImage ; fondu sombre en bas ajouté ici
   en CSS pur (pseudo-élément) pour la lisibilité du texte, sans toucher
   à l'attribut d'image (évite tout conflit entre les deux mécanismes). */
.sk-sector-card {
    position: relative;
    overflow: hidden;
    background-color: #1E3A5F; /* repli si l'image ne charge pas */
}

.sk-sector-card::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 0%, transparent 45%, rgba(2, 37, 79, .92) 100%);
    pointer-events: none;
    z-index: 1;
}

.sk-sector-card > * {
    position: relative;
    z-index: 2;
}

/* Badge de note Google (section "Ils nous font confiance") */
.sk-google-badge {
    gap: 0.8rem !important;
    background: #ffffff;
    border: 1px solid #e4e9f0;
    border-radius: 999px;
    padding: 0.6rem 1.3rem;
    width: fit-content;
    margin: 0 auto 1.3rem;
    box-shadow: 0 4px 14px rgba(2, 37, 79, .06);
}

.sk-google-badge p {
    margin: 0;
    font-size: 0.85rem;
    color: var(--sk-nv);
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.sk-google-score {
    font-size: 1rem;
    color: var(--sk-nv);
}

.sk-google-caption {
    color: var(--sk-mu) !important;
    font-size: 0.75rem !important;
}

.sk-stars {
    display: inline-flex;
    gap: 2px;
    vertical-align: middle;
}

.sk-stars img {
    display: block;
}

.sk-testi-stars-row {
    margin: 0.5rem 0 0.6rem !important;
}

.sk-res-card {
    overflow: hidden;
}

/* Vignette "Ressources" : dégradé de secours uniquement tant qu'aucune
   image réelle n'est définie via le support background natif du bloc. */
.sk-res-thumb:not(.has-background) {
    background: linear-gradient(135deg, #1E3A5F 0%, #02254F 100%);
}

.sk-res-cta {
    height: 100%;
    display: flex !important;
    flex-direction: column;
    gap: 0.9rem;
    padding-top: 1.8rem !important;
    padding-bottom: 1.8rem !important;
}

.sk-res-cta h3,
.sk-res-cta p,
.sk-res-cta .wp-block-buttons {
    margin: 0 !important;
}

/* Carte : la vignette + le corps prennent toute la hauteur disponible,
   le lien "lire/télécharger" reste ancré en bas quelle que soit la
   longueur du titre/texte au-dessus. */
.sk-res-card {
    display: flex !important;
    flex-direction: column;
}

.sk-res-body {
    display: flex !important;
    flex-direction: column;
    flex: 1;
}

.sk-res-body > :last-child {
    margin-top: auto !important;
    padding-top: 0.6rem;
}

.sk-halo-light {
    background: #fdf8fc !important;
    position: relative !important;
    overflow: hidden !important;
}

.sk-halo-light::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 65% 80% at 100% 50%, rgba(0, 166, 180, .07) 0%, transparent 60%);
    pointer-events: none;
    z-index: 0;
}

.sk-halo-dark>*,
.sk-halo-light>* {
    position: relative;
    z-index: 2;
}

.sk-halo-dark h1,
.sk-halo-dark h2,
.sk-halo-dark h3 {
    color: white !important;
}

/* em dans les titres dark → rose magenta (ex : "Actualités Skuria") */
.sk-halo-dark h1 em,
.sk-halo-dark h2 em {
    color: var(--sk-pk-l) !important;
    font-style: normal !important;
}

.sk-halo-dark p,
.sk-halo-dark .wp-block-paragraph {
    color: rgba(255, 255, 255, .58) !important;
    font-size: 1rem !important;
    line-height: 1.65 !important;
    margin: 0 !important;
}

.sk-halo-dark .sk-badge {
    background: rgba(0, 166, 180, .15) !important;
    border: 1px solid rgba(0, 166, 180, .4) !important;
    color: #ff8ec7 !important;
    backdrop-filter: blur(4px);
}

/* Surcharges contextuelles dark — résistent à sk-halo-dark p !important */
.sk-halo-dark .sk-label {
    color: var(--sk-pk) !important;
    font-size: .72rem !important;
    line-height: normal !important;
}

.sk-halo-dark .sk-step-num {
    color: var(--sk-pk) !important;
    font-size: 1.2rem !important;
    line-height: 1 !important;
}

/* sk-hero-card en verre dépoli dans un hero dark avec photo de fond */
.sk-halo-dark .sk-hero-card p,
.sk-halo-dark .sk-hero-card .wp-block-paragraph {
    color: rgba(255, 255, 255, .82) !important;
    font-size: inherit !important;
    line-height: inherit !important;
    margin: inherit !important;
}

.sk-halo-dark .sk-hero-card .sk-hero-card-title {
    color: rgba(255, 255, 255, .55) !important;
    font-size: .75rem !important;
    line-height: normal !important;
    margin-bottom: 1.2rem !important;
}

.sk-halo-dark .sk-hero-features .sk-hf-text {
    color: #fff !important;
    font-size: .88rem !important;
    line-height: 1.4 !important;
    margin: 0 !important;
}

.sk-halo-light .sk-badge {
    background: rgba(0, 166, 180, .1) !important;
    border: 1px solid rgba(0, 166, 180, .2) !important;
    color: var(--sk-pk) !important;
}

/* ── HERO ──────────────────────────────────────────────────── */

.sk-hero-desc {
    font-size: 1rem;
    color: var(--sk-mu);
    line-height: 1.4;
    margin-bottom: 1.75rem;
    max-width: 520px;
}

.sk-halo-dark .sk-hero-desc {
    font-size: 1rem !important;
    color: rgba(255, 255, 255, .58) !important;
    line-height: 1.8 !important;
    margin-bottom: 2rem !important;
    max-width: 500px;
}

.sk-halo-dark .sk-hero-desc-footer,
.sk-halo-dark .sk-hero-desc-footer a {
    font-size: 1rem !important;
    color: rgba(255, 255, 255, .58) !important;
    line-height: 1.6 !important;
}

.sk-sec h2 {
    margin-bottom: 2rem !important;
    font-size: clamp(1.65rem, 2.5vw, 2rem) !important;
}

.sk-sec h1 {
    margin-bottom: 2rem !important;
}

.sk-sec .sk-label {
    margin-bottom: 2rem !important;
}

.sk-rse-grid,
.sk-plan-grid {
    margin-top: 2rem !important;
    gap: 1.2rem !important;
}

.sk-sec-hero p,
.sk-sec-hero .wp-block-paragraph {
    font-size: 1rem;
    line-height: 1.76;
    color: var(--sk-mu);
}

/* Trust pills */

.sk-trust-pill {
    display: inline-flex;
    align-items: center;
    gap: .38rem;
    font-size: .78rem;
    color: var(--sk-mu);
    font-weight: 500;
}

.sk-trust-pill::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--sk-pk);
    flex-shrink: 0;
}

/* Hero card */
.sk-hero-card {
    background: white !important;
    border: 1px solid var(--sk-bd) !important;
    border-radius: var(--sk-r) !important;
    padding: 1.75rem !important;
    box-shadow: 0 8px 36px rgba(13, 29, 45, .08) !important;
    display: flex;
    flex-direction: column;
    align-items: center !important;
    justify-content: center !important;
}

/* Variante verre dépoli quand le hero dark a une photo de fond */
.sk-halo-dark .sk-hero-card {
    background: rgba(255, 255, 255, .08) !important;
    border: 1px solid rgba(255, 255, 255, .18) !important;
    box-shadow: 0 25px 60px rgba(1, 5, 37, .45) !important;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.sk-col-half.sk-hero-card .wp-block-image {
    text-align: center;
    width: 100%;
    margin: 0 !important;
}

.sk-col-half.sk-hero-card .wp-block-image img {
    border-radius: 1rem !important;
    max-width: 100% !important;
    height: auto !important;
}

/* Pills HERO — Souveraineté numérique, 100% France, IA responsable, Support humain */
.sk-hero-pills {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: .45rem !important;
    margin-top: 2rem !important;
    margin-bottom: 1.5rem !important;
}

.sk-hero-pills>.wp-block-group {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: .3rem !important;
    padding: .22rem .8rem .22rem .7rem !important;
    background: rgba(255, 255, 255, .1) !important;
    border: 1px solid rgba(255, 255, 255, .18) !important;
    border-radius: 2rem !important;
    flex: none !important;
    height: auto !important;
    text-align: left !important;
    transition: none !important;
    transform: none !important;
    box-shadow: none !important;
}

.sk-hero-pills .sk-hf-icon {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    align-self: center !important;
    flex-shrink: 0 !important;
}

.sk-hero-pills .sk-hf-icon img {
    width: 18px !important;
    height: 18px !important;
    object-fit: contain !important;
    border-radius: 0 !important;
    filter: none !important;
    display: block !important;
}

.sk-hero-pills h3,
.sk-hero-pills .wp-block-heading {
    font-size: .82rem !important;
    font-weight: 400 !important;
    color: rgba(255, 255, 255, .92) !important;
    margin: 0 !important;
    white-space: nowrap !important;
    line-height: 1 !important;
    align-self: center !important;
}

.sk-hero-card-title {
    font-family: var(--sk-font-title) !important;
    font-weight: 700 !important;
    font-size: .75rem !important;
    color: var(--sk-mu) !important;
    text-transform: uppercase !important;
    letter-spacing: .1em !important;
    margin-bottom: 1.2rem !important;
}

/* Hero features (liste de fonctionnalités) */
.sk-hero-features {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: .35rem;
    padding: 0;
    margin: 0;
    list-style: none;
}

.sk-hero-features li,
.sk-hero-features .sk-hf-item {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    width: 100% !important;
    padding: .55rem .9rem !important;
    box-sizing: border-box;
    border: 1px solid var(--sk-bd);
    border-radius: .6rem;
    background: var(--sk-ow);
    transition: all .25s ease;
    cursor: default;
    gap: .6rem;
}

.sk-hero-features li:hover,
.sk-hero-features .sk-hf-item:hover {
    background: var(--sk-pk-a);
    border-color: rgba(0, 166, 180, .3);
    transform: translateX(4px);
}

/* Variante verre dépoli quand le hero dark a une photo de fond */
.sk-halo-dark .sk-hero-features li,
.sk-halo-dark .sk-hero-features .sk-hf-item {
    background: rgba(255, 255, 255, .07) !important;
    border-color: rgba(255, 255, 255, .16) !important;
}

.sk-halo-dark .sk-hero-features li:hover,
.sk-halo-dark .sk-hero-features .sk-hf-item:hover {
    background: rgba(0, 166, 180, .28) !important;
    border-color: rgba(0, 166, 180, .55) !important;
}

.sk-hero-features figure.sk-hf-icon,
.sk-hero-features .wp-block-image.sk-hf-icon {
    width: 2.2rem !important;
    height: 2.2rem !important;
    min-width: 2.2rem !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: visible;
}

.sk-hero-features .wp-block-image.sk-hf-icon::before {
    content: '';
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0, 166, 180, .28) 0%, transparent 72%);
    opacity: .7;
    transform: scale(.85);
    transition: opacity .35s ease, transform .35s ease;
    z-index: 0;
}

.sk-hero-features .sk-hf-item:hover .wp-block-image.sk-hf-icon::before {
    opacity: 1;
    transform: scale(1.25);
}

.sk-hero-features .sk-hf-icon img {
    width: 1.5rem !important;
    height: 1.5rem !important;
    max-width: 1.5rem !important;
    object-fit: contain;
    display: block;
    position: relative;
    z-index: 1;
    transition: transform .4s cubic-bezier(.34, 1.56, .64, 1);
}

.sk-hero-features .sk-hf-item:hover .sk-hf-icon img {
    transform: scale(1.15) rotate(-6deg);
}

.sk-hero-features .sk-hf-text {
    flex: 1;
    font-size: .88rem;
    color: var(--sk-nv);
}

.sk-hero-features .sk-hf-check {
    font-style: normal;
    color: #fff;
    font-weight: 700;
    font-size: .68rem;
    margin-left: auto;
    padding: 0;
    width: 22px;
    height: 22px;
    min-width: 22px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--sk-pk-l), var(--sk-pk));
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 14px rgba(0, 166, 180, .45);
    transition: transform .3s cubic-bezier(.34, 1.56, .64, 1);
}

.sk-hero-features .sk-hf-item:hover .sk-hf-check {
    transform: scale(1.15) rotate(8deg);
}

/* Espacement bouton CTA dans hero */
.sk-sec-hero .wp-block-buttons,
.sk-hero-left .wp-block-buttons {
    margin-top: 2.5rem !important;
}

/* ── SERVICE CARDS ────────────────────────────────────────── */

.sk-service-card {
    display: flex;
    flex-direction: column;
    border-radius: var(--sk-r);
    border: 1px solid var(--sk-bd);
    padding: 1.6rem;
    height: 100%;
    position: relative;
    overflow: hidden;
    transition: transform .3s cubic-bezier(.22, 1, .36, 1), box-shadow .3s ease, border-color .3s ease, background .4s ease;
    box-shadow: 0 1px 6px rgba(13, 29, 45, .04);
    background: #fff;
}

/* Glow façon hero, révélé au survol */
.sk-service-card::before {
    content: '';
    position: absolute;
    top: -40%;
    right: -30%;
    width: 65%;
    padding-bottom: 65%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0, 166, 180, .16) 0%, transparent 70%);
    opacity: 0;
    transform: scale(.7);
    transition: opacity .4s ease, transform .4s ease;
    pointer-events: none;
    z-index: 0;
}

.sk-service-card::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--sk-pk), var(--sk-pk-l));
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .35s ease;
    z-index: 1;
}

.sk-service-card:hover {
    transform: translateY(-7px) rotate(-.3deg);
    box-shadow: 0 16px 40px rgba(0, 166, 180, .16);
    border-color: rgba(0, 166, 180, .2);
    background: linear-gradient(165deg, #fff 55%, var(--sk-pk-a) 160%);
}

.sk-service-card:hover::before {
    opacity: 1;
    transform: scale(1);
}

.sk-service-card:hover::after {
    transform: scaleX(1);
}

.sk-service-card>* {
    position: relative;
    z-index: 1;
}

.sk-service-card .sk-sc-icon,
.sk-service-card .wp-block-paragraph.sk-sc-icon {
    width: 64px !important;
    height: 64px !important;
    min-height: 64px !important;
    flex: 0 0 64px !important;
    border-radius: 14px !important;
    background: var(--sk-pk-a) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 0 1.25rem 0 !important;
    padding: 0 !important;
    font-size: 2rem !important;
    line-height: 1 !important;
    color: inherit !important;
    box-sizing: border-box !important;
}

.sk-service-card .sk-sc-title {
    font-family: var(--sk-font-title);
    font-weight: 700;
    font-size: 1rem;
    color: var(--sk-nv);
    margin: 0 0 .5rem;
}

.sk-service-card .sk-sc-desc {
    font-size: .85rem;
    line-height: 1.65;
    color: var(--sk-mu);
    flex: 1;
    display: flex;
    flex-direction: column;
}

.sk-service-card .sk-sc-link {
    display: inline-flex;
    align-items: center;
    gap: .28rem;
    margin-top: 1rem;
    font-size: .8rem;
    font-weight: 600;
    color: var(--sk-pk) !important;
    text-decoration: none;
    transition: gap .2s;
}

.sk-service-card .sk-sc-link:hover {
    gap: .5rem;
}

/* Gutenberg natif — éléments à l'intérieur des service cards */
.sk-service-card .wp-block-image {
    width: 64px !important;
    height: 64px !important;
    min-height: 64px;
    border-radius: 0;
    background: none !important;
    border: none !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin: 0 0 1.5rem 0 !important;
    overflow: visible;
    position: relative;
}

/* Halo diffus derrière l'icône, façon glow du hero */
.sk-service-card .wp-block-image::before {
    content: '';
    position: absolute;
    inset: -8px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0, 166, 180, .16) 0%, transparent 72%);
    opacity: .75;
    transform: scale(.85);
    transition: opacity .35s ease, transform .35s ease;
    z-index: 0;
}

/* Petite étincelle façon hero ("La performance en plus ✨"), révélée au survol */
.sk-service-card .wp-block-image::after {
    content: '✨';
    position: absolute;
    top: -8px;
    right: -12px;
    font-size: .85rem;
    line-height: 1;
    opacity: 0;
    transform: scale(.4) rotate(-20deg);
    transition: opacity .3s ease .05s, transform .3s ease .05s;
    z-index: 2;
}

.sk-service-card:hover .wp-block-image::before {
    opacity: 1;
    transform: scale(1.15);
}

.sk-service-card:hover .wp-block-image::after {
    opacity: 1;
    transform: scale(1) rotate(0deg);
}

.sk-service-card .wp-block-image img {
    width: 48px !important;
    height: 48px !important;
    max-width: 48px !important;
    object-fit: contain;
    display: block;
    position: relative;
    z-index: 1;
    transition: transform .4s cubic-bezier(.34, 1.56, .64, 1);
}

.sk-service-card:hover .wp-block-image img {
    transform: scale(1.1) rotate(-6deg);
}

.sk-service-card .wp-block-heading {
    font-family: var(--sk-font-title) !important;
    font-weight: 700 !important;
    font-size: 1rem !important;
    color: var(--sk-nv) !important;
    margin: 0 0 .5rem !important;
    line-height: 1.25 !important;
}

.sk-service-card>p,
.sk-service-card .wp-block-paragraph {
    font-size: .85rem !important;
    line-height: 1.65 !important;
    color: var(--sk-mu) !important;
    margin: 0 !important;
    flex: 1;
}

.sk-service-card .wp-block-buttons {
    margin-top: auto;
    padding-top: 1rem;
}

.sk-service-card .wp-block-buttons .wp-block-button__link {
    font-size: .8rem !important;
    font-weight: 600 !important;
    color: var(--sk-pk) !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    text-decoration: none !important;
    line-height: 1.4 !important;
}

.sk-service-card .wp-block-buttons .wp-block-button__link:hover {
    background: transparent !important;
    transform: none;
}

/* Variante featured (sombre) */
.sk-service-card.featured {
    background: linear-gradient(135deg, var(--sk-nv) 0%, var(--sk-nv-l) 100%) !important;
    border-color: transparent;
}

.sk-service-card.featured .sk-sc-title {
    color: #ffffff !important;
}

.sk-service-card.featured .sk-sc-desc {
    color: rgba(255, 255, 255, .6) !important;
}

.sk-service-card.featured .sk-sc-icon {
    background: rgba(255, 255, 255, .1) !important;
    color: #fff;
}

/* Listes à puces natives Gutenberg dans sk-service-card — équivalent automatique de srv-benefit */
.sk-service-card ul,
.sk-service-card .wp-block-list {
    list-style: none !important;
    margin: 0 0 .5rem !important;
    padding: 0 !important;
    display: flex;
    flex-direction: column;
    gap: .35rem;
    padding-top: .9rem !important;
    border-top: 1px solid rgba(0, 0, 0, .2);
    margin-top: 10px !important;
}

.sk-service-card ul li,
.sk-service-card .wp-block-list li {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    font-size: .75rem;
    color: var(--sk-mu);
    line-height: 1.45;
}

.sk-service-card ul li::before,
.sk-service-card .wp-block-list li::before {
    content: '✓';
    color: var(--sk-pk);
    font-weight: 700;
    font-size: .78rem;
    flex-shrink: 0;
    margin-top: .05rem;
}

.sk-service-card.featured ul,
.sk-service-card.featured .wp-block-list {
    border-top-color: rgba(255, 255, 255, .3) !important;
}

.sk-service-card.featured ul li,
.sk-service-card.featured .wp-block-list li {
    color: rgba(255, 255, 255, .6) !important;
}

/* Bénéfices dans service card */

.sk-service-card.featured .srv-benefits {
    border-top: 1px solid rgba(255, 255, 255, .3) !important;
}

.sk-service-card.featured .srv-benefit {
    color: rgba(255, 255, 255, .6) !important;
}

/* Featured dark — Gutenberg natif */
.sk-service-card.featured .wp-block-image {
    background: rgba(255, 255, 255, .1) !important;
}

.sk-service-card.featured .wp-block-heading {
    color: #ffffff !important;
}

.sk-service-card.featured>p,
.sk-service-card.featured .wp-block-paragraph {
    color: rgba(255, 255, 255, .6) !important;
}

.sk-service-card.featured .wp-block-buttons .wp-block-button__link {
    color: rgba(255, 255, 255, .85) !important;
}

.sk-service-card.featured .wp-block-buttons .wp-block-button__link:hover {
    color: #fff !important;
}

/* ── FEATURE ROW ──────────────────────────────────────────── */

.svc-feature-row {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: .85rem;
    background: white;
    border: 1px solid var(--sk-bd);
    border-radius: 1rem;
    padding: 1rem 1.1rem;
    transition: border-color .2s, box-shadow .2s;
}

.svc-feature-row:hover {
    border-color: rgba(0, 166, 180, .18);
    box-shadow: 0 4px 18px rgba(0, 166, 180, .07);
}

.svc-feature-row .sk-fr-icon {
    width: 36px;
    height: 36px;
    border-radius: 9px;
    background: var(--sk-pk-a);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 18px;
    color: var(--sk-pk);
}

.svc-feature-row .sk-fr-title {
    font-family: var(--sk-font-title);
    font-weight: 700;
    font-size: .95rem;
    color: var(--sk-nv);
    margin: 0 0 2px;
    line-height: 1.2;
}

.svc-feature-row .sk-fr-desc {
    font-size: .83rem;
    color: var(--sk-mu);
    line-height: 1.6;
    margin: 0;
}

/* ── RSE CARDS ────────────────────────────────────────────── */

.sk-rse-icon,
.sk-rse-card .wp-block-paragraph.sk-rse-icon {
    width: 56px !important;
    height: 56px !important;
    min-height: 56px !important;
    flex: 0 0 56px !important;
    border-radius: 12px !important;
    background: var(--sk-pk-a) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 0 1rem 0 !important;
    padding: 0 !important;
    font-size: 1.75rem !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
}

.sk-rse-card .wp-block-image {
    width: 60px !important;
    height: 60px !important;
    max-height: none !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    margin: 0 0 1.15rem !important;
    position: relative;
}

/* Halo diffus derrière l'icône, façon hero / cartes expertises */
.sk-rse-card .wp-block-image::before {
    content: '';
    position: absolute;
    inset: -8px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0, 166, 180, .16) 0%, transparent 72%);
    opacity: .7;
    transform: scale(.85);
    transition: opacity .35s ease, transform .35s ease;
    z-index: 0;
}

/* Petite étincelle façon hero, révélée au survol */
.sk-rse-card .wp-block-image::after {
    content: '✨';
    position: absolute;
    top: -8px;
    right: -10px;
    font-size: .8rem;
    line-height: 1;
    opacity: 0;
    transform: scale(.4) rotate(-20deg);
    transition: opacity .3s ease .05s, transform .3s ease .05s;
    z-index: 2;
}

.sk-rse-card:hover .wp-block-image::before {
    opacity: 1;
    transform: scale(1.15);
}

.sk-rse-card:hover .wp-block-image::after {
    opacity: 1;
    transform: scale(1) rotate(0deg);
}

.sk-rse-card .wp-block-image img {
    width: 48px !important;
    height: 48px !important;
    max-height: none !important;
    max-width: 48px !important;
    object-fit: contain !important;
    position: relative;
    z-index: 1;
    transition: transform .4s cubic-bezier(.34, 1.56, .64, 1);
}

.sk-rse-card:hover .wp-block-image img {
    transform: scale(1.1) rotate(-6deg);
}

.sk-rse-card {
    background: #fff;
    border-radius: var(--sk-r);
    padding: 1.6rem;
    border: 1px solid rgba(13, 29, 45, .06);
    text-align: left;
    height: 100%;
    position: relative;
    overflow: hidden;
    transition: transform .3s cubic-bezier(.22, 1, .36, 1), box-shadow .3s ease, border-color .3s ease, background .4s ease;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

/* Glow façon hero, révélé au survol */
.sk-rse-card::before {
    content: '';
    position: absolute;
    top: -40%;
    right: -30%;
    width: 65%;
    padding-bottom: 65%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0, 166, 180, .14) 0%, transparent 70%);
    opacity: 0;
    transform: scale(.7);
    transition: opacity .4s ease, transform .4s ease;
    pointer-events: none;
    z-index: 0;
}

.sk-rse-card>* {
    position: relative;
    z-index: 1;
}

.sk-rse-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 14px 36px rgba(0, 166, 180, .14);
    border-color: rgba(0, 166, 180, .18);
    background: linear-gradient(165deg, #fff 55%, var(--sk-pk-a) 160%);
}

.sk-rse-card:hover::before {
    opacity: 1;
    transform: scale(1);
}

.sk-rse-card .wp-block-heading,
.sk-rse-card h3 {
    font-weight: 700 !important;
    font-size: .95rem !important;
    color: var(--sk-nv) !important;
}

.sk-rse-card>p,
.sk-rse-card .wp-block-paragraph {
    font-size: .82rem !important;
    color: var(--sk-mu) !important;
    line-height: 1.58 !important;
}

.sk-rse-card .sk-rc-icon {
    font-size: 1.9rem;
    color: var(--sk-pk);
    margin-bottom: 1rem;
}

.sk-rse-card .sk-rc-title {
    font-family: var(--sk-font-title);
    font-weight: 700;
    font-size: .9rem;
    color: var(--sk-nv);
    margin: 0 0 .5rem;
}

.sk-rse-card .sk-rc-desc {
    font-size: .79rem;
    color: var(--sk-mu);
    line-height: 1.58;
}

.sk-rse-card .wp-block-buttons {
    margin-top: auto;
    padding-top: 1rem;
}

.sk-rse-card .wp-block-buttons .wp-block-button__link {
    font-size: .8rem !important;
    font-weight: 600 !important;
    color: var(--sk-pk) !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    text-decoration: none !important;
    line-height: 1.4 !important;
}

.sk-rse-card .wp-block-buttons .wp-block-button__link:hover {
    background: transparent !important;
    transform: none;
}

/* Exception : bouton primary explicite dans une sk-rse-card */
.sk-rse-card .wp-block-buttons:has(.sk-btn-primary) {
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: .4rem !important;
}

.sk-rse-card .wp-block-button.sk-btn-primary .wp-block-button__link {
    background: var(--sk-pk) !important;
    color: #fff !important;
    border-radius: 2rem !important;
    padding: .55rem 1rem !important;
    box-shadow: 0 4px 18px var(--sk-pk-glow) !important;
    font-size: .98rem !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
    line-height: 1.3 !important;
}

.sk-rse-card .wp-block-button.sk-btn-primary .wp-block-button__link:hover {
    background: var(--sk-pk-d) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 26px rgba(0, 166, 180, .38) !important;
    color: #fff !important;
}

/* ── SECTOR GRID ──────────────────────────────────────────── */

.sk-sector-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: .75rem !important;
}

/* Variante 2 colonnes (opt-in, ne change pas .sk-sector-grid par défaut ailleurs) */
.sk-sector-grid.sk-sector-grid-2col {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 1rem !important;
}

@media (max-width: 700px) {
    .sk-sector-grid.sk-sector-grid-2col {
        grid-template-columns: 1fr !important;
    }
}

/* ── SECTOR ITEM — carte horizontale indépendante de sk-rse-card */

.sk-sector-item {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 1.1rem !important;
    background: #fff !important;
    border: 1px solid var(--sk-bd) !important;
    border-radius: var(--sk-r) !important;
    padding: 1.1rem 1.4rem !important;
    box-shadow: 0 1px 6px rgba(13, 29, 45, .05) !important;
    transition: transform .25s, box-shadow .25s, border-color .25s !important;
    text-align: left !important;
}

.sk-sector-item:hover {
    transform: translateX(4px) !important;
    box-shadow: 0 4px 18px rgba(0, 166, 180, .09) !important;
    border-color: rgba(0, 166, 180, .18) !important;
}

.sk-sector-item .sk-rse-icon,
.sk-sector-item .wp-block-paragraph.sk-rse-icon {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    flex: 0 0 48px !important;
    border-radius: 10px !important;
    font-size: 1.5rem !important;
    margin: 0 !important;
}

.sk-sector-item .wp-block-group {
    flex: 1 !important;
    text-align: left !important;

}

.sk-sector-item .wp-block-heading,
.sk-sector-item h3 {
    margin-top: 0 !important;
    margin-bottom: .3rem !important;
    font-size: .9rem !important;
    text-align: left !important;
}

.sk-sector-item p,
.sk-sector-item .wp-block-paragraph {
    margin: 0 !important;
    font-size: .8rem !important;
    color: var(--sk-mu) !important;
    text-align: left !important;
}

/* ── SPLIT LAYOUT (Fonctionnalités + En chiffres) ────────── */

.sk-split-layout,
.wp-block-group.sk-split {
    display: flex !important;
    gap: 2rem !important;
    column-gap: 4rem !important;
    align-items: stretch !important;
    flex-wrap: wrap !important;
}

.sk-split-left {
    flex: 1 1 calc(50% - 1rem) !important;
    min-width: 280px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: .4rem !important;
}

.sk-split-right {
    flex: 1 1 calc(50% - 1rem) !important;
    min-width: 280px !important;
    border-radius: var(--sk-r) !important;
    padding: 2rem !important;
}

/* Items dans sk-split-left */
.sk-feature-row {
    display: flex !important;
    align-items: flex-start !important;
    gap: 1rem !important;
    padding: 1rem 1.1rem !important;
    background: #fff !important;
    border: 1px solid var(--sk-bd) !important;
    border-radius: .75rem !important;
    margin-bottom: .65rem !important;
    position: relative;
    overflow: hidden;
    transition: transform .3s cubic-bezier(.22, 1, .36, 1), box-shadow .3s ease, border-color .3s ease;
}

.sk-feature-row::before {
    content: '';
    position: absolute;
    top: -60%;
    right: -20%;
    width: 55%;
    padding-bottom: 55%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0, 166, 180, .12) 0%, transparent 70%);
    opacity: 0;
    transform: scale(.7);
    transition: opacity .4s ease, transform .4s ease;
    pointer-events: none;
    z-index: 0;
}

.sk-feature-row:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 30px rgba(0, 166, 180, .12);
    border-color: rgba(0, 166, 180, .2);
}

.sk-feature-row:hover::before {
    opacity: 1;
    transform: scale(1);
}

.sk-feature-row>* {
    position: relative;
    z-index: 1;
}

.sk-feature-row .sk-rse-icon,
.sk-feature-row .wp-block-paragraph.sk-rse-icon {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    flex: 0 0 44px !important;
    border-radius: 10px !important;
    font-size: 1.3rem !important;
    margin: 0 !important;
}

.sk-feature-row .wp-block-image {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    flex: 0 0 48px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    margin: 0 !important;
    position: relative;
}

.sk-feature-row .wp-block-image::before {
    content: '';
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0, 166, 180, .16) 0%, transparent 72%);
    opacity: .6;
    transform: scale(.85);
    transition: opacity .35s ease, transform .35s ease;
    z-index: 0;
}

.sk-feature-row:hover .wp-block-image::before {
    opacity: 1;
    transform: scale(1.2);
}

.sk-feature-row .wp-block-image img {
    width: 30px !important;
    height: 30px !important;
    max-height: none !important;
    max-width: 30px !important;
    object-fit: contain !important;
    position: relative;
    z-index: 1;
    transition: transform .4s cubic-bezier(.34, 1.56, .64, 1);
}

.sk-feature-row:hover .wp-block-image img {
    transform: scale(1.12) rotate(-6deg);
}

.sk-feature-row .wp-block-group {
    flex: 1 !important;

}

.sk-feature-row .wp-block-heading,
.sk-feature-row h3 {
    font-size: .9rem !important;
    font-weight: 700 !important;
    margin: 0 0 .25rem 0 !important;
    color: var(--sk-nv) !important;
}

.sk-feature-row .wp-block-group {
    flex: 1 !important;
    min-width: 0 !important;
}

.sk-feature-row p,
.sk-feature-row .wp-block-paragraph {
    font-size: .8rem !important;
    color: var(--sk-mu) !important;
    margin: 0 !important;
    line-height: 1.55 !important;
}

/* Badge Recommandé sur card featured (fond sombre) */
.sk-service-card.featured .sk-badge,
.sk-service-card.featured p.sk-badge {
    background: var(--sk-pk) !important;
    color: #fff !important;
    border-color: transparent !important;
    margin-bottom: 2rem !important;
}

/* Stats panel (côté droit, fond sombre) */
.sk-stats-panel-title {
    font-size: .72rem !important;
    font-weight: 700 !important;
    letter-spacing: .14em !important;
    text-transform: uppercase !important;
    color: #fff !important;
    margin: 0 0 .4rem 0 !important;
    line-height: normal !important;
}

.sk-stats-panel-sub {
    font-size: .82rem !important;
    color: rgba(255, 255, 255, .55) !important;
    margin: 0 0 1.5rem 0 !important;
    line-height: 1.5 !important;
}

/* ── PILLAR CARDS (sombre) ────────────────────────────────── */

.sk-pillar {

    background: rgba(255, 255, 255, .2);
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 1rem;
    padding: 1rem;
    transition: background .2s;
}

.sk-pillar:hover {
    background: rgba(0, 166, 180, .1);
}

.sk-pillar .sk-pl-icon {
    color: #fff !important;
    font-size: 1.35rem;
    margin-bottom: .4rem;
    display: inline-block;
}

.sk-pillar .sk-pl-title {
    color: #fff !important;
    font-family: var(--sk-font-title);
    font-weight: 500;
    font-size: 1.2rem;
    margin-bottom: .3rem;
}

.sk-pillar .sk-pl-desc {
    color: rgba(255, 255, 255, .58) !important;
    font-size: .95rem;
    line-height: 1.5;
    margin: 0;
}

/* ── STATISTIQUES SOMBRES ─────────────────────────────────── */

/* Grille dashboard pour les stats "En chiffres" / "Le marché en chiffres" */
.sk-stats-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
    gap: .65rem;
    margin-top: .5rem !important;
}

/* Si le nombre de cartes est impair, la dernière s'étale et se centre */
.sk-stats-grid>*:last-child:nth-child(odd) {
    grid-column: 1 / -1;
    max-width: calc(50% - .5rem);
    margin: 0 auto;
}

@media (max-width: 700px) {
    .sk-stats-grid {
        grid-template-columns: 1fr;
    }

    .sk-stats-grid>*:last-child:nth-child(odd) {
        max-width: 100%;
    }
}

/* Aside stat → tuile dashboard (fond sombre) */
.svc-aside-stat {
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: .85rem;
    padding: .9rem .9rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: .2rem;
    margin: 0 !important;
    position: relative;
    overflow: hidden;
    transition: transform .3s cubic-bezier(.22, 1, .36, 1), box-shadow .3s ease, border-color .3s ease, background .3s ease;
}

.svc-aside-stat::before {
    content: '';
    position: absolute;
    top: -40%;
    right: -20%;
    width: 70%;
    padding-bottom: 70%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0, 166, 180, .2) 0%, transparent 70%);
    opacity: 0;
    transform: scale(.7);
    transition: opacity .4s ease, transform .4s ease;
    pointer-events: none;
    z-index: 0;
}

.svc-aside-stat:hover {
    transform: translateY(-6px);
    background: rgba(0, 166, 180, .1);
    border-color: rgba(0, 166, 180, .35);
    box-shadow: 0 16px 34px rgba(0, 166, 180, .2);
}

.svc-aside-stat:hover::before {
    opacity: 1;
    transform: scale(1);
}

.svc-aside-stat>* {
    position: relative;
    z-index: 1;
}

/* Icône de la tuile */
.svc-aside-stat .sk-as-icon.wp-block-image {
    width: 32px !important;
    height: 32px !important;
    margin: 0 0 .15rem !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    position: relative;
}

.svc-aside-stat .sk-as-icon.wp-block-image::before {
    content: '';
    position: absolute;
    inset: -8px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0, 166, 180, .35) 0%, transparent 72%);
    opacity: .7;
    transform: scale(.85);
    transition: opacity .35s ease, transform .35s ease;
    z-index: 0;
}

.svc-aside-stat:hover .sk-as-icon.wp-block-image::before {
    opacity: 1;
    transform: scale(1.2);
}

.svc-aside-stat .sk-as-icon img {
    width: 18px !important;
    height: 18px !important;
    max-width: 18px !important;
    object-fit: contain;
    position: relative;
    z-index: 1;
    transition: transform .4s cubic-bezier(.34, 1.56, .64, 1);
}

.svc-aside-stat:hover .sk-as-icon img {
    transform: scale(1.12) rotate(-6deg);
}

.svc-aside-stat .sk-as-num {
    font-family: var(--sk-font-title);
    font-weight: 700;
    font-size: 1.5rem;
    color: var(--sk-pk-l);
    line-height: 1.1;
}

.svc-aside-stat .sk-as-num em {
    color: var(--sk-pk-l);
    font-style: normal;
    font-weight: 700;
}

.svc-aside-stat.centerTitle .sk-as-num {
    text-align: center;
    font-size: 3rem;
}

.svc-aside-stat.centerTitle .sk-as-num em {
    font-weight: 600;
}

/* Le nombre : gros, en dégradé rose */
.svc-aside-stat .wp-block-heading {
    font-family: var(--sk-font-title) !important;
    font-weight: 800 !important;
    font-size: clamp(.95rem, 1.7vw, 1.3rem) !important;
    line-height: 1.15 !important;
    margin: 0 !important;
    font-style: normal;
    text-align: center !important;
    white-space: normal !important;
    overflow-wrap: break-word;
    word-break: break-word;
    hyphens: auto;
    width: 100%;
    background: linear-gradient(135deg, var(--sk-pk-l), #ff9fd4);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.svc-aside-stat .wp-block-heading em {
    font-style: normal;
    font-weight: inherit;
}

/* Le libellé sous le nombre */
.svc-aside-stat .sk-as-label,
.svc-aside-stat p {
    font-family: var(--sk-font-body) !important;
    font-weight: 600 !important;
    font-size: .72rem !important;
    color: #fff !important;
    margin: 0 !important;
    font-style: normal;
    text-align: center !important;
    line-height: 1.3 !important;
    white-space: normal !important;
}

/* Texte complémentaire (2e paragraphe éventuel) : plus discret */
.svc-aside-stat p+p {
    font-weight: 400 !important;
    font-size: .65rem !important;
    color: rgba(255, 255, 255, .5) !important;
    margin-top: .2rem !important;
}

/* ── COMPARATEUR WORKSPACE ────────────────────────────────── */

.sk-sec-workspace p {
    color: var(--sk-mu);
    line-height: 1.72;
}

.sk-check,
.sk-cross {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    margin-right: 8px;
    font-size: 14px;
    font-weight: bold;
    vertical-align: middle;
}

.sk-check {
    color: #059669;
}

/* ── TÉMOIGNAGES ──────────────────────────────────────────── */

.sk-sec-services,
.sk-sec-testimonials {
    padding: 5rem 3rem;
}

@media (max-width: 768px) {
    .sk-sec-hero {
        padding: 1rem 1.5rem;
    }

    .sk-sec-services,
    .sk-sec-testimonials {
        padding: 3rem 1.5rem;
    }
}

.sk-sec-testimonials>p,
.sk-sec-testimonials .wp-block-paragraph {
    color: var(--sk-mu) !important;
}

/* Badge "Recommandations LinkedIn vérifiées" (en-tête de section) */
.sk-li-verified-badge {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    border: 1px solid rgba(0, 119, 181, .28);
    border-radius: 2rem;
    padding: .35rem 1rem;
    font-size: .78rem;
    font-weight: 600;
    color: var(--sk-nv);
    background: rgba(0, 119, 181, .05);
    margin-bottom: 1rem;
}

.sk-li-verified-badge svg {
    fill: #0077b5;
    flex-shrink: 0;
}

.sk-zones-list {
    list-style: none;
    column-count: 2;
    column-gap: 2rem;
}

.sk-zones-list li {
    margin-bottom: .6rem;
    break-inside: avoid;
}

.sk-check-list {
    list-style: none;
}

.sk-check-list li {
    position: relative;
    padding-left: 1.4rem;
    color: var(--sk-nv);
    margin-bottom: .6rem;
}

.sk-check-list.sk-check-list-icons li {
    padding-left: 1.9rem;
}

.sk-check-list.sk-check-list-icons li img {
    position: absolute;
    left: 0;
    top: 2px;
    width: 18px;
    height: 18px;
}

.sk-testi-card {
    background: var(--sk-ow);
    border: 1px solid var(--sk-bd);
    border-radius: var(--sk-r);
    padding: 1.75rem;
    display: flex;
    flex-direction: column;
    gap: .5rem;
    position: relative;
    overflow: hidden;
    transition: transform .25s, box-shadow .25s, border-color .25s;
}

.sk-testi-card::before {
    content: none;
}

.sk-testi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 40px rgba(0, 166, 180, .1);
    border-color: rgba(0, 166, 180, .18);
}

.sk-testi-card:hover::before {
    color: rgba(0, 166, 180, .14);
}

.sk-testi-card-head {
    display: flex;
    align-items: flex-start;
    gap: .9rem;
}

.sk-testi-avatar {
    background: rgba(0, 131, 143, .08) !important;
    color: #00838F !important;
    border: 1.5px solid rgba(0, 131, 143, .2);
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 1rem;
    flex-shrink: 0;
}

.sk-testi-meta {
    flex: 1;
    min-width: 0;
}

.sk-testi-name {
    font-family: var(--sk-font-title);
    font-weight: 700;
    font-size: .92rem;
    color: var(--sk-nv);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sk-testi-role {
    font-size: .75rem;
    color: var(--sk-mu);
    margin-top: .1rem;
    line-height: 1.4;
}

.sk-testi-company {
    font-size: .73rem;
    font-weight: 600;
    color: var(--sk-pk);
    margin-top: .12rem;
}

.sk-testi-li-badge {
    display: flex;
    align-items: center;
    gap: .3rem;
    background: rgba(0, 119, 181, .07);
    border: 1px solid rgba(0, 119, 181, .15);
    border-radius: .5rem;
    padding: .25rem .5rem;
    flex-shrink: 0;
    text-decoration: none;
}

.sk-testi-li-badge span {
    font-size: .65rem;
    font-weight: 600;
    color: #004182 !important;
}

.sk-testi-li-badge svg {
    fill: #004182 !important;
}

.sk-testi-stars {
    display: flex;
    gap: 2px;
    font-size: .95rem;
    color: #f59e0b;
    letter-spacing: 1px;

}

.sk-testi-quote {
    font-size: .88rem;
    color: var(--sk-nv);
    line-height: 1.75;
    position: relative;
    z-index: 1;
    flex: 1;
}

/* ── FAQ / DETAILS ACCORDÉON ──────────────────────────────── */

.wp-block-details,
details.sk-faq-item {
    background: #fff;
    border: 1px solid var(--sk-bd) !important;
    border-radius: var(--sk-r) !important;
    overflow: hidden;
    transition: border-color .2s, box-shadow .2s;

}

.wp-block-details[open],
details.sk-faq-item[open] {
    border-color: rgba(0, 166, 180, .2) !important;
    box-shadow: 0 4px 20px rgba(0, 166, 180, .08);
}

.wp-block-details summary,
details.sk-faq-item summary {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 1.1rem 1.3rem !important;
    font-family: var(--sk-font-body) !important;
    font-weight: 600 !important;
    font-size: .93rem !important;
    color: var(--sk-nv) !important;
    cursor: pointer;
    list-style: none;
    gap: 1rem;
}

.wp-block-details summary::-webkit-details-marker {
    display: none;
}

.wp-block-details[open] summary,
details.sk-faq-item[open] summary {
    color: var(--sk-pk) !important;
}

.wp-block-details summary::after,
details.sk-faq-item summary::after {
    content: '+';
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--sk-pk-a);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1.2rem;
    font-weight: 400;
    color: var(--sk-pk);
    transition: background .2s, transform .3s;
    line-height: 1;
}

.wp-block-details[open] summary::after,
details.sk-faq-item[open] summary::after {
    background: var(--sk-pk);
    color: #fff;
    content: '−';
}

.wp-block-details>*:not(summary),
details.sk-faq-item>*:not(summary) {
    font-size: .88rem !important;
    color: var(--sk-mu) !important;
    line-height: 1.72 !important;
    padding: 0 1.3rem 1.2rem !important;
}

/* ── LIEN "… EN VOIR PLUS" (repli léger, pas un accordéon carte) ── */
details.sk-read-more {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
    margin: -.4rem 0 1rem !important;
}

details.sk-read-more[open] {
    border: none !important;
    box-shadow: none !important;
}

details.sk-read-more summary {
    display: inline-flex !important;
    justify-content: flex-start !important;
    padding: 0 !important;
    font-size: .88rem !important;
    font-weight: 600 !important;
    color: var(--sk-pk-l) !important;
    gap: .35rem !important;
}

details.sk-read-more summary::after {
    content: '▾';
    width: auto;
    height: auto;
    background: none !important;
    font-size: .7rem !important;
    font-weight: 400;
    color: currentColor !important;
    transition: transform .25s ease;
}

details.sk-read-more[open] summary {
    color: var(--sk-pk-l) !important;
}

details.sk-read-more[open] summary::after {
    transform: rotate(180deg);
}

details.sk-read-more summary:hover {
    color: #fff !important;
}

details.sk-read-more>*:not(summary) {
    padding: .6rem 0 0 !important;
    font-size: 1rem !important;
    color: rgba(255, 255, 255, .58) !important;
    line-height: 1.65 !important;
    margin: 0 !important;
}

/* ── STEPS (étapes numérotées) ────────────────────────────── */

.steps .sk-step {
    display: flex;
    flex-direction: row;
    gap: 1.4rem;
    padding: 1.4rem 0;
    border-bottom: 1px solid var(--sk-bd);
    text-align: left;
}

.steps .sk-step:last-child {
    border-bottom: none;
}

.steps .sk-step-num {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    flex-shrink: 0;
    background: var(--sk-pk);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-family: var(--sk-font-title);
    font-weight: 800;
    font-size: .95rem;
    margin-top: .1rem;
}

/* ── CALLOUTS (sk-callout) ────────────────────────────────── */

.sk-callout {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 1.2rem;
    padding: 1.25rem 1.5rem;
    border-radius: 0 .85rem .85rem 0;
    border: none;
    border-left: 4px solid var(--sk-pk);
    background-color: var(--sk-pk-a);
    text-align: left;
    margin: 1.5rem 0;
}

.sk-callout .sk-callout-title {
    font-family: var(--sk-font-title);
    font-weight: 700;
    font-size: .95rem;
    color: var(--sk-nv);
    margin-bottom: .3rem;
    line-height: 1.2;
}

.sk-callout .sk-callout-desc {
    font-size: .88rem;
    line-height: 1.65;
    color: var(--sk-mu);
    margin: 0;
}

.sk-callout.warn {
    background-color: rgba(245, 158, 11, .08);
    border-left-color: #d97706;
}

.sk-callout.warn .sk-callout-title {
    color: #78350f;
}

.sk-callout.info {
    background-color: rgba(13, 29, 45, .05);
    border-left-color: var(--sk-nv);
}

.sk-callout.info .sk-callout-title {
    color: var(--sk-nv);
}

.sk-callout.ok {
    background-color: rgba(16, 185, 129, .08);
    border-left-color: #059669;
}

.sk-callout.ok .sk-callout-title {
    color: #064e3b;
}

/* ── IMAGE BOX CARD (sk-img-box-el) ──────────────────────── */

.sk-img-box-el {
    background: #fff;
    border-radius: var(--sk-r);
    border: 1px solid var(--sk-bd);
    box-shadow: 0 2px 14px rgba(13, 29, 45, .06);
    overflow: hidden;
    transition: transform .25s, box-shadow .25s;
    display: flex;
    flex-direction: column;
}

.sk-img-box-el:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 36px rgba(0, 166, 180, .12);
}

.sk-img-box-el .sk-ib-img {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.2rem;
    background: linear-gradient(135deg, var(--sk-pk-a), rgba(0, 166, 180, .02));
}

.sk-img-box-el .sk-ib-img img,
.sk-img-box-el .sk-ib-img svg {
    width: 100%;
    max-height: 130px;
    object-fit: contain;
}

.sk-img-box-el .sk-ib-body {
    padding: .85rem 1rem 1rem;
    text-align: left;
}

.sk-img-box-el .sk-ib-title {
    font-family: var(--sk-font-title);
    font-weight: 700;
    font-size: .88rem;
    color: var(--sk-nv);
    margin: 0 0 .2rem;
}

.sk-img-box-el .sk-ib-desc {
    font-size: .75rem;
    color: var(--sk-mu);
    line-height: 1.5;
    margin: 0;
}

.sk-img-box-el.hcard-dark {
    background: linear-gradient(145deg, var(--sk-nv) 0%, var(--sk-nv-l) 100%);
    border-color: transparent;
}

.sk-img-box-el.hcard-dark .sk-ib-img {
    background: rgba(255, 255, 255, .05);
}

.sk-img-box-el.hcard-dark .sk-ib-title {
    color: #fff;
}

.sk-img-box-el.hcard-dark .sk-ib-desc {
    color: rgba(255, 255, 255, .55);
}

/* IMG-BOX-EL : sélecteurs Gutenberg natifs */
.sk-img-box-el .wp-block-image {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.2rem;
    background: linear-gradient(135deg, var(--sk-pk-a), rgba(0, 166, 180, .02));
    margin: 0 !important;
    flex-shrink: 0;
}

.sk-img-box-el .wp-block-image img {
    width: 100%;
    max-height: 130px;
    object-fit: contain;
    display: block;
}

.sk-img-box-el .wp-block-heading {
    font-family: var(--sk-font-title) !important;
    font-weight: 700 !important;
    font-size: .88rem !important;
    color: var(--sk-nv) !important;
    margin: 0 !important;
    padding: .85rem 1rem .5rem !important;
    line-height: 1.3 !important;
}

.sk-img-box-el>p,
.sk-img-box-el .wp-block-paragraph {
    font-size: .75rem !important;
    color: var(--sk-mu) !important;
    line-height: 1.5 !important;
    margin: 0 !important;
    padding: 0 1rem 1rem !important;
}

/* Dark variant — Gutenberg natif */
.sk-img-box-el.hcard-dark .wp-block-image {
    background: rgba(255, 255, 255, .05);
}

.sk-img-box-el.hcard-dark .wp-block-heading {
    color: #fff !important;
}

.sk-img-box-el.hcard-dark>p,
.sk-img-box-el.hcard-dark .wp-block-paragraph {
    color: rgba(255, 255, 255, .55) !important;
}

/* ── NAV CHIPS ────────────────────────────────────────────── */

.svc-nav-chip {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--sk-bd);
    border-radius: 1rem;
    padding: .5rem 1rem;
    transition: all .3s ease;
    cursor: pointer;
    font-size: .82rem;
    font-weight: 500;
    color: var(--sk-nv);
    text-decoration: none;
}

.svc-nav-chip:hover {
    border-color: var(--sk-pk);
    background: var(--sk-pk-a);
    color: var(--sk-pk);
}

/* ── NAV OTHERS ───────────────────────────────────────────── */

.svc-nav-others {
    padding: 3.5rem 0;
    background: white;
    border-top: 1px solid var(--sk-bd);
}

.svc-nav-others h3 {
    font-family: var(--sk-font-title);
    font-weight: 700;
    font-size: .9rem;
    color: var(--sk-mu);
    text-transform: uppercase;
    letter-spacing: .08em;
    text-align: center;
    margin-bottom: 1.5rem;
}

/* ── CTA SECTION ──────────────────────────────────────────── */

.sk-sec-cta {
    background-color: transparent;
    background: linear-gradient(135deg, var(--sk-pk) 0%, var(--sk-pk-d) 100%) !important;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.sk-sec-cta h2 {
    font-family: var(--sk-font-title);
    font-size: clamp(1.8rem, 3.5vw, 2.7rem);
    color: white;
    margin-bottom: .85rem;
}

.sk-sec-cta p {
    color: rgba(255, 255, 255, .82);
    font-size: 1.05rem;
    margin-bottom: 2.25rem;
    line-height: 1.7;
}

/* ── CTA ÉCHANGE (variante home) ──────────────────────────── */

/* Glow radial rose (même recette que .sk-hero-pme::before) pour donner
   de la profondeur au bandeau — remplace le halo générique de .sk-halo-dark
   pour cet élément précis (le pointillé de .sk-halo-dark::after reste actif). */

.sk-cta-echange-left {
    flex: 1 1 420px;
    max-width: 560px;
}

.sk-cta-echange-left h2 {
    font-size: clamp(1.4rem, 2.6vw, 1.9rem) !important;
    margin-bottom: .6rem !important;
}

.sk-cta-echange-right {
    flex: 0 1 auto;
    align-items: center !important;
    gap: 1.1rem !important;
}

.sk-halo-dark .sk-cta-echange-or {
    color: rgba(255, 255, 255, .45) !important;
    font-size: .95rem !important;
    margin: 0 !important;
    padding-top: 20px;
}

.sk-halo-dark .sk-cta-echange-phone,
.sk-halo-dark .sk-cta-echange-phone a {
    color: #fff !important;
    font-weight: 600 !important;
    font-size: 1.5rem !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    padding-top: 10px;
}

.sk-halo-dark .sk-cta-echange-phone a {
    display: inline-flex !important;
    align-items: center !important;
    gap: .4rem !important;
    text-decoration: none !important;
    transition: color .2s;
}

.sk-halo-dark .sk-cta-echange-phone a:hover {
    color: var(--sk-pk-l) !important;
}

/* L'emoji 📞 saisi dans le bloc est converti par WordPress en <img> couleur
   (Twemoji) : impossible à teinter en CSS. On le masque et on le remplace
   par un glyphe texte ☎ coloré en rose via ::before. */
.sk-cta-echange-phone img.emoji {
    display: none !important;
}

.sk-halo-dark .sk-cta-echange-phone a::before {
    content: '\260E';
    color: var(--sk-pk-l);
    font-size: 1rem;
    line-height: 1;
}

@media (max-width: 782px) {

    .sk-cta-echange-right {
        width: 100%;
    }
}

/* ── PRICING CARD ─────────────────────────────────────────── */

.svc-plan.is-layout-flex {
    align-items: flex-start !important;
}

.svc-plan .wp-block-buttons {
    align-self: center;
}

.svc-plan {
    background: white;
    border: 1px solid var(--sk-bd) !important;
    border-radius: var(--sk-r) !important;
    padding: 2.5rem 2rem !important;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    transition: transform .25s, border-color .25s, box-shadow .25s;
    position: relative;
    overflow: hidden;
    height: 100%;
    max-width: 380px;
    min-width: 280px;
}

.svc-plan:hover {
    transform: translateY(-5px);
    box-shadow: 0 14px 42px rgba(0, 166, 180, .1);
    border-color: rgba(0, 166, 180, .2);
}

.svc-plan.popular {
    background: var(--sk-nv);
    transform: scale(1.05);
    z-index: 10;
    box-shadow: 0 20px 50px rgba(0, 166, 180, .15) !important;
    border: 2px solid var(--sk-pk) !important;
}

.svc-plan.popular:hover {
    transform: scale(1.07) translateY(-10px);
    box-shadow: 0 30px 60px rgba(0, 166, 180, .25) !important;
}

.svc-plan.popular::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, transparent, var(--sk-pk-l), transparent);
    animation: simple-glow 3s infinite;
}

.svc-plan-badge {
    position: absolute !important;
    top: 1.25rem !important;
    right: 1.25rem !important;
    background: var(--sk-pk);
    color: white;
    padding: 4px 12px;
    border-radius: 1rem;
    font-size: .68rem;
    font-weight: 700;
    line-height: 1;
    display: inline-block;
}

.svc-plan-name {
    font-family: var(--sk-font-title);
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--sk-nv);
    margin-bottom: 1.5rem !important;

}

.svc-plan.popular .svc-plan-name {
    color: white;
}

.svc-plan-amount {
    font-family: var(--sk-font-title) !important;
    font-weight: 700 !important;
    font-size: 1.9rem !important;
    color: var(--sk-pk) !important;
    line-height: 1 !important;
    margin-bottom: 2rem !important;
}

.svc-plan.popular .svc-plan-unit {
    color: rgba(255, 255, 255, .45);
}

.svc-plan.popular .svc-plan-desc {
    color: rgba(255, 255, 255, .45);
}

/* Titres et paragraphes non-classés dans le plan populaire */
.svc-plan.popular .wp-block-heading,
.svc-plan.popular h2,
.svc-plan.popular h3 {
    color: #fff !important;
}

.svc-plan.popular .wp-block-paragraph:not(.svc-plan-amount):not(.svc-plan-badge) {
    color: rgba(255, 255, 255, .65) !important;
}

.svc-plan-desc {
    font-size: .82rem;
    color: var(--sk-mu);
    line-height: 1.6;
}

.svc-plan-features {
    border-top: 1px solid var(--sk-bd);
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    flex-grow: 1;
    list-style: none;
    padding-left: 0;
}

.svc-plan.popular .svc-plan-features {
    border-color: rgba(255, 255, 255, .1);
}

.svc-plan-features li {
    font-size: .85rem;
    color: var(--sk-mu);
    margin-bottom: 8px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.svc-plan-features li::before {
    content: '✓';
    color: var(--sk-pk);
    font-weight: 700;
    flex-shrink: 0;
}

.svc-plan.popular .svc-plan-features li {
    color: rgba(255, 255, 255, .7);
}

.svc-plan.popular .svc-plan-features li::before {
    color: var(--sk-pk-l);
}

@media (max-width: 768px) {
    .svc-plan {
        margin-top: 1rem !important;
        margin-bottom: 1rem !important;
    }
}

/* ── TABLE COMPARATIF (sk-table-styled) ───────────────────── */

.sk-table-styled {
    border-radius: var(--sk-r);
    overflow: hidden;
    border: 1px solid var(--sk-bd);
    box-shadow: 0 4px 24px rgba(13, 29, 45, .07);
    margin: 2rem 0;
}

.sk-table-styled table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
}

.sk-table-styled thead th {
    background-color: var(--sk-ow);
    color: var(--sk-nv);
    padding: 1.1rem 1.4rem;
    font-family: var(--sk-font-title);
    font-weight: 700;
    border-bottom: 2px solid var(--sk-bd);
}

.sk-table-styled thead th:last-child {
    background: linear-gradient(135deg, var(--sk-nv), var(--sk-nv-l));
    color: white;
}

.sk-table-styled tbody td,
.sk-table-styled tbody th {
    padding: 1rem 1.4rem;
    font-size: .88rem;
    border-bottom: 1px solid var(--sk-bd);
    color: var(--sk-nv);
}

.sk-table-styled tbody th[scope="row"] {
    font-weight: 600;
    width: 34%;
}

.sk-table-styled tbody td:last-child {
    background-color: var(--sk-pk-a);
    font-weight: 500;
}

.sk-table-styled small {
    display: block;
    color: var(--sk-mu);
    font-size: .75rem;
    font-weight: 400;
    margin-top: 4px;
}

@media (max-width: 768px) {
    .sk-table-styled table thead {
        display: none !important;
    }

    .sk-table-styled table tr {
        border: 2px solid var(--sk-pk) !important;
        margin-bottom: 25px !important;
        display: block;
        border-radius: var(--sk-r);
        overflow: hidden;
    }

    .sk-table-styled table td,
    .sk-table-styled table th[scope="row"] {
        display: block !important;
        text-align: right !important;
        padding-left: 45% !important;
        position: relative;
        width: 100% !important;
    }

    .sk-table-styled table td::before,
    .sk-table-styled table th[scope="row"]::before {
        content: attr(data-label);
        position: absolute;
        left: 15px;
        font-weight: bold;
        color: var(--sk-pk);
        font-size: .75rem;
        text-transform: uppercase;
    }

    .sk-table-styled table th[scope="row"] {
        background-color: var(--sk-nv) !important;
        color: white !important;
        text-align: center !important;
        padding: 12px !important;
    }

    .sk-table-styled table th[scope="row"]::before {
        display: none !important;
    }
}

.sk-table-styled.has-footer tbody tr:last-child {
    background-color: var(--sk-nv) !important;
    color: white !important;
}

.sk-table-styled.has-footer tbody tr:last-child td,
.sk-table-styled.has-footer tbody tr:last-child th {
    color: white !important;
    font-weight: 600;
    border-bottom: none !important;
}

.sk-table-styled.has-footer tbody tr:last-child td:last-child {
    background-color: transparent !important;
}

/* ── SOMMAIRE (TABLE OF CONTENTS) ──────────────────────────── */

.sk-toc {
    background-color: var(--sk-ow);
    border: 1px solid var(--sk-bd);
    border-radius: var(--sk-r);
    padding: 1.4rem;
    margin: 2rem 0;
}

.sk-toc-header {
    padding-bottom: .75rem;
    border-bottom: 1px solid var(--sk-bd);
    font-family: var(--sk-font-title);
    font-size: .75rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--sk-mu);
    font-weight: 700;
    margin-bottom: 1rem;
}

.sk-toc ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.sk-toc ul li {
    margin-bottom: .38rem;
}

.sk-toc ul li a {
    display: inline-flex;
    align-items: flex-start;
    gap: .5rem;
    font-size: .81rem;
    color: var(--sk-pk);
    font-weight: 500;
    text-decoration: none;
    line-height: 1.4;
}

.sk-toc ul li a:hover {
    color: var(--sk-nv);
}

.sk-toc ul ul {
    margin-left: 1.2rem;
    margin-top: .38rem;
}

/* ── CALLOUT "À RETENIR" ─────────────────────────────────────── */
.sk-callout {
    border-left: 4px solid var(--sk-pk);
    background: rgba(0, 166, 180, .06);
    border-radius: 0 .75rem .75rem 0;
    padding: 1rem 1.25rem;
    margin: 1.5rem 0;
}

.sk-callout-title {
    font-weight: 700 !important;
    color: var(--sk-nv) !important;
    margin-bottom: .35rem !important;
}

.sk-callout p:last-child {
    margin-bottom: 0 !important;
    color: var(--sk-fg);
}

/* ── ARTICLE BODY ────────────────────────────────────────────── */
.sk-sec.sk-article {
    padding-top: 2.5rem !important;
    padding-bottom: 3rem !important;
}

.sk-sec.sk-article h2 {
    font-size: clamp(1.8rem, 3vw, 2.5rem) !important;
    font-size: 1.65rem;
    font-weight: 700;
    color: var(--sk-nv);
    margin: 2.75rem 0 1rem;
    line-height: 1.25;
}

.sk-sec.sk-article h2 code {
    font-family: 'Courier New', Courier, monospace;
    font-size: inherit;
    font-weight: inherit;
    background: none;
    padding: 0;
    color: inherit;
}

.sk-sec.sk-article h3 {
    font-size: 1.08rem;
    font-weight: 700;
    color: var(--sk-nv);
    margin: 1.75rem 0 .5rem;
}

.sk-sec.sk-article p {
    margin-bottom: .9rem;
    line-height: 1.75;
    color: var(--sk-fg);
}

/* ── TABLEAU ARTICLE ─────────────────────────────────────────── */

/* Figure wrapper Gutenberg : pleine largeur + coins arrondis */
.sk-sec.sk-article .wp-block-table,
.sk-sec.sk-article figure.wp-block-table {
    display: block !important;
    width: 100% !important;
    border: 1px solid #e2e5ed !important;
    border-radius: .85rem !important;
    overflow: hidden !important;
    margin: 1.75rem auto !important;
    padding: 0 !important;
    box-shadow: none !important;
}

.sk-sec.sk-article table {
    width: 100% !important;
    border-collapse: collapse !important;
    font-size: .88rem;
    margin: 0 !important;
    border: none !important;
}

/* Neutraliser les bordures Gutenberg par défaut sur les cellules */
.sk-sec.sk-article table th,
.sk-sec.sk-article table td {
    border: none !important;
    border-bottom: 1px solid #e2e5ed !important;
}

/* En-têtes */
.sk-sec.sk-article thead th {
    padding: .85rem 1.1rem !important;
    text-align: left !important;
    font-size: .82rem;
    font-weight: 600;
    background: #f3f4f7 !important;
    color: var(--sk-nv) !important;
}

/* 3e colonne d'en-tête : fond navy */
.sk-sec.sk-article thead th:last-child {
    background: var(--sk-nv) !important;
    color: #fff !important;
    font-weight: 700;
}

/* Corps — lignes alternées (cols 1 & 2) */
.sk-sec.sk-article tbody tr:nth-child(odd) th[scope="row"],
.sk-sec.sk-article tbody tr:nth-child(odd) td:not(:last-child) {
    background: #fff !important;
}

.sk-sec.sk-article tbody tr:nth-child(even) th[scope="row"],
.sk-sec.sk-article tbody tr:nth-child(even) td:not(:last-child) {
    background: #f8f8fb !important;
}

/* Colonne Critère */
.sk-sec.sk-article tbody th[scope="row"] {
    font-weight: 700 !important;
    color: var(--sk-nv) !important;
    padding: .9rem 1.1rem !important;
    vertical-align: top;
    width: 25%;
}

/* Cellules data */
.sk-sec.sk-article tbody td {
    padding: .9rem 1.1rem !important;
    vertical-align: top;
    line-height: 1.5;
    color: var(--sk-fg) !important;
}

/* Colonne "À vérifier" : texte rose */
.sk-sec.sk-article tbody td:nth-child(2) {
    color: var(--sk-pk) !important;
}

/* Colonne "Questions à poser" : fond rose pastel */
.sk-sec.sk-article tbody td:last-child {
    background: #fdf0f6 !important;
    color: var(--sk-fg) !important;
}

/* Dernière ligne : pas de bordure basse */
.sk-sec.sk-article tbody tr:last-child td,
.sk-sec.sk-article tbody tr:last-child th {
    border-bottom: none !important;
}

/* ── ARTICLE STATS (cartes 99,9% / 0 / 100%) ────────────────── */
.sk-article-stats {
    display: flex;
    gap: 1.25rem;
    margin: 2rem 0 2.5rem;
    flex-wrap: wrap;
}

.sk-article-stat {
    flex: 1 1 0;
    min-width: 140px;
    border: 1px solid var(--sk-bd);
    border-radius: var(--sk-r);
    padding: 1.5rem 1.25rem;
    text-align: center;
}

.sk-article-stat-num {
    font-size: 2.4rem !important;
    font-weight: 800 !important;
    color: var(--sk-pk) !important;
    line-height: 1 !important;
    margin: 0 0 .5rem !important;
}

.sk-article-stat-desc {
    font-size: .82rem !important;
    color: var(--sk-mu) !important;
    line-height: 1.45 !important;
    margin: 0 !important;
}

/* ══ UTILITAIRES LAYOUT ════════════════════════════════════════
   Classes applicables sur les blocs Groupe/Colonne dans Gutenberg
═══════════════════════════════════════════════════════════════ */

/* Input/select pleine largeur dans un bloc Rangée Gutenberg */
.wp-block-group.is-layout-flex input[type="text"],
.wp-block-group.is-layout-flex input[type="email"],
.wp-block-group.is-layout-flex input[type="search"],
.wp-block-group.is-layout-flex input[type="url"],
.wp-block-group.is-layout-flex input[type="tel"],
.wp-block-group.is-layout-flex input[type="number"],
.wp-block-group.is-layout-flex select,
.wp-block-group.is-layout-flex textarea,
.wp-block-group.is-layout-flex .wp-block-search__input {
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
}

/* Classe utilitaire : force le bloc lui-même à s'étirer dans la rangée */
.sk-input-full,
.wp-block-group.sk-input-full,
.wp-block-column.sk-input-full {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    width: 100% !important;
}

/* 50 % dans un bloc Rangée (wp-block-group is-layout-flex) ou Colonnes.
   Calc aligné sur le column-gap de 4rem défini ci-dessous : 4rem / 2 = 2rem. */
.sk-col-half,
.wp-block-group.sk-col-half,
.wp-block-column.sk-col-half {
    flex: 0 0 calc(50% - 2rem) !important;
    max-width: calc(50% - 2rem) !important;
    width: calc(50% - 2rem) !important;
    min-width: 0 !important;
}

/* Espace horizontal entre colonnes sk-col-half (desktop uniquement).
   column-gap n'a aucun effet en flex-direction:column → zéro impact mobile. */
.is-layout-flex:has(> .sk-col-half) {
    column-gap: 4rem !important;
}

@media (max-width: 768px) {

    .sk-col-half,
    .wp-block-group.sk-col-half,
    .wp-block-column.sk-col-half {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        width: 100% !important;
    }

    .is-layout-flex:has(> .sk-col-half) {
        flex-direction: column !important;
    }
}

/* ══ LAYOUTS SECTIONS HOMEPAGE ═════════════════════════════════
   Grilles et wrappers spécifiques aux sections de la page d'accueil
═══════════════════════════════════════════════════════════════ */

/* ── Section base ──────────────────────────────────────────── */
.sk-sec {
    padding: 3rem 3rem;
}

@media (max-width: 768px) {
    .sk-sec {
        padding: 3rem 1.5rem;
    }
}

/* Préserver les couleurs des paragraphes dans svc-plan (cards Tarifs) */
.svc-plan .wp-block-paragraph,
.svc-plan p {
    color: var(--sk-mu) !important;
}

.svc-plan.popular .wp-block-paragraph,
.svc-plan.popular p {
    color: rgba(255, 255, 255, .65) !important;
}

.svc-plan .wp-block-paragraph.svc-plan-amount,
.svc-plan p.svc-plan-amount {
    color: var(--sk-pk) !important;
}

.svc-plan.popular .wp-block-paragraph.svc-plan-amount {
    color: var(--sk-pk) !important;
}

/* Restaurer les couleurs du panel stats (sk-split-right) — même spécificité (0,3,0), après = prioritaire */
.sk-split-right .wp-block-paragraph.sk-stats-panel-title {
    color: #fff !important;
    margin-bottom: 2rem !important;
}

.sk-split-right .wp-block-paragraph.sk-stats-panel-sub {
    color: rgba(255, 255, 255, .55) !important;
    margin-bottom: 2rem !important;
}

.sk-split-right .wp-block-paragraph.sk-as-num {
    color: var(--sk-pk-l) !important;
}

.sk-split-right .wp-block-paragraph.sk-as-label {
    color: rgba(255, 255, 255, .55) !important;
}

/* ── Hero layout ──────────────────────────────────────────── */
.sk-sec-hero {
    padding: 2rem 2rem !important;
}

.sk-sec-hero h1 {
    font-size: clamp(1.8rem, 3vw, 2.5rem) !important;
    line-height: 1.15 !important;
}

/* ── HERO HOME (image en arrière-plan du groupe + fond marine) ── */
.sk-hero-pme {
    background-color: #010525 !important;
    position: relative;
    overflow: hidden;
    margin: 0;
    padding-bottom: 6rem;
}

/* Voile marine + glow rose au-dessus de l'image de fond du groupe */
.sk-hero-pme::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 55% 65% at 10% 15%, rgba(0, 166, 180, .16), transparent 60%),
        linear-gradient(90deg, #010525 0%, rgba(1, 5, 37, .82) 22%, rgba(1, 5, 37, .38) 48%, rgba(1, 5, 37, .1) 68%);
    pointer-events: none;
    z-index: 1;
}

/* Fondu bas pour raccorder la photo à la ligne des features */
.sk-hero-pme::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 30%;
    background: linear-gradient(to top, #010525 0%, transparent 100%);
    pointer-events: none;
    z-index: 1;
}

.sk-hero-pme-body {
    position: relative;
    z-index: 2;
    max-width: 1320px;
    margin: 0 auto;

}

.sk-hero-pme-text {
    max-width: 560px;
}

.sk-hero-pme-text .sk-badge {
    background: rgba(0, 166, 180, .15) !important;
    border: 1px solid rgba(0, 166, 180, .4) !important;
    color: #ff8ec7 !important;
    margin-bottom: 1.5rem !important;
}

.sk-hero-pme-text h1 {
    color: #fff !important;
    font-size: clamp(2.1rem, 3.4vw, 3rem) !important;
    line-height: 1.14 !important;
    margin: 0 0 1.25rem !important;
}

.sk-hero-pme-text h1 em {
    color: var(--sk-pk-l) !important;
    font-style: normal !important;
}

.sk-hero-pme-text .sk-hero-desc {
    color: rgba(255, 255, 255, .62) !important;
    max-width: 480px;
    margin-bottom: 2rem !important;
}

/* ── Bandeau blanc de features, chevauche le bas du hero ────── */
.sk-hero-feat-bar {
    position: relative;
    z-index: 5;
    background: #fff;
    border-radius: 1.25rem;
    box-shadow: 0 20px 50px rgba(1, 5, 37, .18), 0 2px 10px rgba(1, 5, 37, .06);
    max-width: 1200px;
    margin: -45px auto 0;
    padding: 1.75rem 2rem;
    align-items: center !important;
    gap: 1.25rem 0 !important;
}

.sk-hero-feat-item {
    flex: 1 1 0 !important;
    padding: 0 1.25rem !important;
    position: relative;
}

.sk-hero-feat-item+.sk-hero-feat-item::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 34px;
    background: rgba(13, 29, 45, .1);
}

.sk-hero-feat-icon.wp-block-image {
    width: 40px;
    height: 40px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin: 0 1rem 0 0 !important;
}

.sk-hero-feat-icon img {
    width: 34px;
    height: 34px;
    object-fit: contain;
}

.sk-hero-feat-flag.wp-block-image {
    width: 60px;
    height: 40px;

    overflow: hidden;
    display: block !important;
    flex-shrink: 0;
    margin: 0 1rem 0 0 !important;

}

.sk-hero-feat-flag img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.sk-hero-feat-text {
    font-size: .85rem !important;
    font-weight: 600 !important;
    color: var(--sk-nv) !important;
    line-height: 1.3 !important;
    margin: 0 !important;
}

@media (max-width: 900px) {
    .sk-hero-feat-bar {
        margin: -40px 1.25rem 0;
        padding: 1.5rem;
        gap: 1.5rem !important;
    }

    .sk-hero-feat-item {
        flex: 1 1 40% !important;
        padding: 0 !important;
    }

    .sk-hero-feat-item::before {
        display: none;
    }
}

@media (max-width: 560px) {
    .sk-hero-feat-bar {
        margin-top: -28px;
    }

    .sk-hero-feat-item {
        flex: 1 1 100% !important;
    }
}

@media (max-width: 900px) {
    .sk-hero-pme {
        background-position: 70% 20% !important;
    }

    .sk-hero-pme::before {
        background:
            radial-gradient(ellipse 70% 50% at 20% 10%, rgba(0, 166, 180, .16), transparent 60%),
            linear-gradient(180deg, rgba(1, 5, 37, .55) 0%, rgba(1, 5, 37, .78) 45%, #010525 78%);
    }

    .sk-hero-pme::after {
        height: 15%;
    }

    .sk-hero-pme-text {
        max-width: 100%;
    }
}

/* ── Écrans bas (14" et similaires) : hero moins haut pour laisser deviner la suite ── */
@media (max-height: 850px) and (min-width: 901px) {
    .sk-hero-pme {
        padding-bottom: 3rem;
    }

    .sk-hero-pme-body {
        padding-top: 1.5rem;
    }

    .sk-hero-pme-text .sk-badge {
        margin-bottom: .85rem !important;
    }

    .sk-hero-pme-text h1 {
        font-size: clamp(1.8rem, 2.6vw, 2.4rem) !important;
        margin-bottom: .75rem !important;
    }

    .sk-hero-pme-text .sk-hero-desc {
        margin-bottom: 1.1rem !important;
    }

    .sk-hero-feat-bar {
        margin-top: -50px;
        padding: 1.1rem 1.5rem;
    }

    .sk-hero-feat-icon.wp-block-image {
        width: 32px;
        height: 32px;
    }

    .sk-hero-feat-icon img {
        width: 26px;
        height: 26px;
    }

    .sk-sec-hero {
        padding: 1rem 2rem !important;
    }

    .sk-hero-card {
        padding: 1.15rem !important;
    }

    .sk-hero-card-title {
        margin-bottom: .6rem !important;
    }

    .sk-hero-features {
        gap: .25rem !important;
    }

    .sk-hero-features li,
    .sk-hero-features .sk-hf-item {
        padding: .4rem .8rem !important;
    }
}

.sk-hero-btns {
    display: flex;
    align-items: center;
    gap: .85rem;
    flex-wrap: wrap;
}

.sk-hero-inner {
    align-items: flex-start !important;
}

/* ── HERO SINGLE (page article / guide) ─────────────────────── */
.sk-hero-inner.sk-hero-single {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    max-width: 780px !important;
    margin: 0 auto !important;
    gap: 0 !important;
}

.sk-hero-single .sk-hero-excerpt {
    font-size: 1.08rem !important;
    line-height: 1.72 !important;
    color: rgba(255, 255, 255, .78) !important;
    margin: 1.1rem 0 0 !important;
}

.sk-hero-single .sk-article-meta {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: .5rem 1.5rem !important;
    margin-top: 1.4rem !important;
    font-size: .85rem !important;
    color: rgba(255, 255, 255, .55) !important;
}

@media (max-width: 900px) {
    .sk-hero-inner {
        flex-direction: column;
        padding: 50px 0 40px;
        gap: 2.5rem;
    }

}

/* ── IA Section layout ─────────────────────────────────────── */

.sk-ia-left h2,
.sk-ia-left .wp-block-heading {
    color: #fff !important;
    font-family: var(--sk-font-title) !important;
    font-size: clamp(1.6rem, 3vw, 2.2rem) !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    margin: 0 !important;
}

.sk-ia-left h2 em,
.sk-ia-left .wp-block-heading em {
    font-style: normal;
    background: linear-gradient(135deg, var(--sk-pk), #e9008e);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.sk-ia-left>p,
.sk-ia-left .wp-block-paragraph {
    color: rgba(255, 255, 255, .72) !important;
    font-size: .95rem !important;
    line-height: 1.65 !important;
    margin: 0 !important;
}

/* Boutons empilés verticalement dans la section IA */
.sk-ia-btns {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: .75rem !important;
}

.sk-ia-right {
    flex: 0 0 380px;
    max-width: 380px;
}

.sk-steps-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: .6rem;
}

.sk-step-item {
    display: flex;
    align-items: center;
    gap: 1rem;
    width: 100%;
    box-sizing: border-box;
    background: rgba(255, 255, 255, .06);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: var(--sk-r);
    padding: .9rem 1.2rem;
    transition: background .2s;
}

.sk-step-item:hover {
    background: rgba(255, 255, 255, .1);
}

.sk-step-num {
    font-style: normal !important;
    font-family: var(--sk-font-title) !important;
    font-weight: 700 !important;
    font-size: 1.5rem !important;
    color: var(--sk-pk) !important;
    line-height: 1;

}

/* ── STEPS TIMELINE (frise horizontale numérotée) ──────────────
   Parent : .sk-steps-timeline (flex nowrap)
   Enfants : .sk-step × N
   Ligne : ::before sur le parent, z-index 0
   Cercles : .sk-step-num, z-index 1 (au-dessus de la ligne)
═══════════════════════════════════════════════════════════════ */
.sk-steps-timeline {
    position: relative !important;
    align-items: flex-start !important;
    gap: 0 !important;
    margin-top: 2em !important;
}

/* Ligne horizontale reliant les cercles */
.sk-steps-timeline::before {
    content: '';
    position: absolute;
    top: 27px;
    left: 12.5%;
    right: 12.5%;
    /* centre du dernier step */
    height: 2px;
    background: var(--sk-pk);
    z-index: 0;
}

.sk-steps-timeline .sk-step {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    padding: 0 1rem !important;
    position: relative !important;
}

/* Cercle numéroté */
.sk-steps-timeline .sk-step-num {
    width: 56px !important;
    height: 56px !important;
    border-radius: 50% !important;
    border: 2px solid var(--sk-pk) !important;
    color: var(--sk-pk) !important;
    font-size: 1.25rem !important;
    font-weight: 700 !important;
    font-family: var(--sk-font-title) !important;
    background: #fff !important;
    margin: 0 auto 1.5rem !important;
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    line-height: 1 !important;
}

/* Icône */
.sk-steps-timeline .sk-step-icon {
    margin: 0 auto .75rem !important;
    display: block !important;
}

.sk-steps-timeline .sk-step-icon img {
    max-height: 40px !important;
    width: auto !important;
    object-fit: contain !important;
    display: block !important;
    margin: 0 auto !important;
}

/* Titre */
.sk-steps-timeline .sk-step .wp-block-heading {
    font-size: 1rem !important;
    font-weight: 700 !important;
    margin-bottom: .5rem !important;
    text-align: center !important;
}

/* Description */
.sk-steps-timeline .sk-step>.wp-block-paragraph {
    font-size: .875rem !important;
    color: var(--sk-mu) !important;
    text-align: center !important;
    line-height: 1.55 !important;

}

/* ── Mobile : empilement vertical, ligne cachée ── */
@media (max-width: 768px) {
    .sk-steps-timeline {
        flex-direction: column !important;
        gap: 1.75rem !important;
    }

    .sk-steps-timeline::before {
        display: none;
    }

    .sk-steps-timeline .sk-step {
        flex-direction: row !important;
        align-items: flex-start !important;
        text-align: left !important;
        gap: 1rem !important;
        padding: 0 !important;
    }

    .sk-steps-timeline .sk-step-num {
        flex-shrink: 0 !important;
        margin: 0 !important;
    }

    .sk-steps-timeline .sk-step-icon {
        display: none !important;
    }

    .sk-steps-timeline .sk-step .wp-block-heading,
    .sk-steps-timeline .sk-step>.wp-block-paragraph {
        text-align: left !important;
    }
}

@media (max-width: 900px) {

    .sk-ia-right {
        flex: none;
        max-width: 100%;
        width: 100%;
    }
}

/* ── Workspace Section layout ─────────────────────────────── */

.sk-ws-left h2,
.sk-ws-left .wp-block-heading {
    font-family: var(--sk-font-title) !important;
    font-size: clamp(1.5rem, 2.8vw, 2.1rem) !important;
    font-weight: 700 !important;
    color: var(--sk-nv) !important;
    line-height: 1.2 !important;
    margin: 0 !important;
}

.sk-app-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .65rem;
}

/* ── HERO APPS : 6 chips compacts sur une seule ligne ─────────
   Ciblage strict .sk-sec-hero .sk-app-grid (pas de sk-hero-card
   dans le DOM) → zéro impact sur les autres pages.
   ─────────────────────────────────────────────────────────────── */
.sk-sec-hero .sk-app-grid {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    gap: .45rem !important;
    width: 100% !important;
    grid-template-columns: none !important;
}

.sk-sec-hero .sk-app-grid .sk-service-card {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    padding: .65rem .35rem !important;
    border-radius: .8rem !important;
    gap: .3rem !important;
    align-items: center !important;
    justify-content: center !important;
    height: auto !important;
}

.sk-sec-hero .sk-app-grid .sk-service-card .sk-app-icon {
    font-size: 1.35rem !important;
    margin: 0 !important;
}

.sk-sec-hero .sk-app-grid .sk-service-card .sk-app-name {
    font-size: .62rem !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    margin: 0 !important;
    text-align: center !important;
}

.sk-app-icon {
    font-size: 1.8rem !important;
    line-height: 1 !important;
    margin: 0 !important;
}

.sk-app-name {
    font-family: var(--sk-font-title) !important;
    font-weight: 600 !important;
    font-size: .72rem !important;
    color: var(--sk-nv) !important;
    text-align: center !important;
    margin: 0 !important;
    line-height: 1.2 !important;
}

/* ══ IMAGE SHOWCASE AVEC GLOW ═══════════════════════════════════
   Chaque section a sa propre classe modificatrice avec 4 variables :
     --sk-phone-w      : largeur du phone  (% du conteneur)
     --sk-phone-bottom : distance depuis le bas  (négatif = déborde)
     --sk-phone-right  : distance depuis la droite (négatif = déborde)
     --sk-phone-pad    : padding-bottom du conteneur (espace pour le phone)
   ════════════════════════════════════════════════════════════════ */

/* ── Base commune ──────────────────────────────────────────── */
.sk-split-img {
    position: relative !important;
    display: block !important;
    padding-bottom: var(--sk-phone-pad, 22%) !important;
    overflow: visible !important;
    background: transparent !important;
    border-radius: 0 !important;
}

/* Glow gradient derrière les deux images */
.sk-split-img::before {
    content: '';
    position: absolute;
    inset: -10% -15% 0;
    background: radial-gradient(ellipse 85% 75% at 50% 45%,
            rgba(0, 166, 180, .28) 0%,
            rgba(140, 0, 215, .16) 38%,
            transparent 66%);
    filter: blur(50px);
    pointer-events: none;
    z-index: 0;
    border-radius: 50%;
}

/* Screenshot desktop — pleine largeur, fond */
.sk-split-img .wp-block-image:first-child {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    margin: 0 !important;
    z-index: 1 !important;
}

/* Mockup phone — positionné via les variables de la section */
.sk-split-img .wp-block-image:last-child {
    position: absolute !important;
    width: var(--sk-phone-w, 48%) !important;
    bottom: var(--sk-phone-bottom, -8%) !important;
    right: var(--sk-phone-right, -2%) !important;
    margin: 0 !important;
    z-index: 2 !important;
}

/* Image unique (pas de phone) */
.sk-split-img .wp-block-image:only-child {
    position: relative !important;
    width: 100% !important;
}

.sk-split-img .wp-block-image img {
    border-radius: 1.1rem !important;
    box-shadow:
        0 22px 55px rgba(13, 29, 45, .22),
        0 4px 18px rgba(0, 166, 180, .14) !important;
    width: 100% !important;
    height: auto !important;
    display: block !important;
    object-fit: contain !important;
}

.sk-split-img .wp-block-image:last-child img {
    box-shadow: none !important;
}

/* ── MESSAGERIE ────────────────────────────────────────────── */
.sk-split-img--mail {
    --sk-phone-w: 40%;
    --sk-phone-bottom: 28%;
    --sk-phone-right: -3%;
    --sk-phone-pad: 24%;
}

/* ── DRIVE ─────────────────────────────────────────────────── */
.sk-split-img--drive {
    --sk-phone-w: 45%;
    --sk-phone-bottom: 30%;
    --sk-phone-right: -4%;
    --sk-phone-pad: 20%;
}

/* ── Mobile ────────────────────────────────────────────────── */
@media (max-width: 768px) {

    .sk-split-img--mail,
    .sk-split-img--drive,
    .sk-split-img--chat {
        --sk-phone-w: 58%;
        --sk-phone-bottom: -6%;
        --sk-phone-right: 0%;
        --sk-phone-pad: 28%;
    }
}

/* ── Utilitaire : border-radius sur image ─────────────────── */
.sk-img-r img {
    border-radius: 1.2rem !important;
}

/* ── Hosting Section layout ───────────────────────────────── */
/* Fond / couleurs / padding : sk-halo-dark.
   Layout 2 colonnes : bloc Row Gutenberg natif.           */

.sk-pillars-grid {
    flex: 1;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.2rem;
}

.sk-pillar h3,
.sk-pillar .wp-block-heading {
    color: #fff !important;
    font-weight: 700 !important;
    font-size: .95rem !important;
    font-family: var(--sk-font-title) !important;
    margin: 0 0 .3rem !important;
    line-height: 1.3 !important;
}

.sk-pillar p,
.sk-pillar .wp-block-paragraph {
    color: rgba(255, 255, 255, .58) !important;
    font-size: .82rem !important;
    line-height: 1.5 !important;
    margin: 0 !important;
}

.sk-pillar .sk-pillar-icon {
    font-size: 1.5rem;
    display: block;
    margin-bottom: .4rem;
}

/* Fond plus prononcé pour rester lisible sur la photo (reflets fuchsia) du fond de section.
   Note : #sk-sec-hosting est un ID (attribut "anchor" Gutenberg), pas une classe. */
#sk-sec-hosting .sk-pillar {
    background: rgba(1, 5, 37, .6);
    border-color: rgba(255, 255, 255, .14);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

#sk-sec-hosting .sk-pillar:hover {
    background: linear-gradient(135deg, rgba(0, 166, 180, .35), rgba(1, 5, 37, .7));
    border-color: rgba(232, 0, 138, .45);
}

#sk-sec-hosting .sk-pillar h3,
#sk-sec-hosting .sk-pillar .wp-block-heading {
    color: var(--sk-wh) !important;
}

#sk-sec-hosting .sk-pillar p,
#sk-sec-hosting .sk-pillar .wp-block-paragraph {
    color: rgba(255, 255, 255, .78) !important;
}

/* Même traitement pour les cartes "En chiffres" à droite (.sk-step-item) sur la photo de fond */
#sk-sec-hosting .sk-step-item {
    background: rgba(1, 5, 37, .6);
    border-color: rgba(255, 255, 255, .14);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

#sk-sec-hosting .sk-step-item:hover {
    background: linear-gradient(135deg, rgba(0, 166, 180, .35), rgba(1, 5, 37, .7));
    border-color: rgba(232, 0, 138, .45);
}

#sk-sec-hosting .sk-step-item p {
    color: rgba(255, 255, 255, .82) !important;
}

@media (max-width: 900px) {

    .sk-pillars-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 600px) {
    .sk-pillars-grid {
        grid-template-columns: 1fr;
    }
}

/* ── FAQ section 2 colonnes ────────────────────────────────── */
.sk-sec-faq {
    background: var(--sk-bg);
    padding: 5rem 3rem !important;
}

@media (max-width: 768px) {
    .sk-sec-faq {
        padding: 3rem 1.5rem !important;
    }
}

.sk-faq-inner {
    display: flex;
    gap: 4rem;
    align-items: flex-start;
}

.sk-faq-left {
    flex: 0 0 340px;
    position: sticky;
    top: 0;
    align-self: flex-start;
}

.sk-faq-left .wp-block-heading {
    font-size: clamp(1.8rem, 3vw, 2.5rem) !important;
    line-height: 1.15 !important;
    margin-bottom: 1.25rem !important;
}

.sk-faq-left>p:not(.sk-label),
.sk-faq-left .wp-block-paragraph:not(.sk-label) {
    color: var(--sk-mu) !important;
}

.sk-faq-right {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: .3rem;
}

@media (max-width: 860px) {
    .sk-faq-inner {
        flex-direction: column;
        gap: 2rem;
    }

    .sk-faq-left {
        flex: unset;
        position: static;
        width: 100%;
    }
}

/* ── CTA final section ─────────────────────────────────────── */
.sk-sec-cta {
    padding: 88px 0;
}

.sk-sec-cta .sk-container {
    max-width: 680px;
    text-align: center;
}

/* ── Boutons hero (sk-hero-btns) dans contexte dark ─────────── */
/* Cible le lien interne (pas le wrapper) pour éviter le double border */
.sk-halo-dark .sk-hero-btns .sk-btn-outline,
.sk-halo-dark .sk-hero-btns .sk-btn-outline.sk-btn,
.sk-halo-dark .sk-hero-btns a.sk-btn-outline {
    border: 2px solid rgba(255, 255, 255, .35) !important;
    color: #fff !important;
}

.sk-halo-dark .sk-hero-btns .sk-btn-outline,
.sk-halo-dark .sk-hero-btns .sk-btn-outline.sk-btn:hover,
.sk-halo-dark .sk-hero-btns a.sk-btn-outline:hover {
    background: rgba(255, 255, 255, .1) !important;
    border-color: rgba(255, 255, 255, .6) !important;
}

/* ── Reset marges <p> pour classes converties depuis <span> ─── */
p.sk-badge,
p.sk-label,
p.sk-trust-pill,
p.sk-app-chip,
p.sk-pillar-icon,
p.sk-rse-icon {
    margin: 0 !important;
}

/* ── Bandeau navigation services ───────────────────────────── */
.sk-sec-services-nav {
    padding: 3.5rem 0;
    border-top: 1px solid var(--sk-bd);
}

.sk-services-nav-title {
    font-size: .72rem !important;
    font-weight: 700 !important;
    letter-spacing: .14em !important;
    text-transform: uppercase !important;
    color: var(--sk-nv) !important;
    text-align: center !important;
    margin-bottom: 1.75rem !important;
    font-family: var(--sk-font-title) !important;
}

/* Pill = wp:button avec classe sk-service-pill sur le div wrapper */
.sk-service-pill .wp-block-button__link {
    background: transparent !important;
    color: var(--sk-nv) !important;
    border: 1.5px solid rgba(13, 29, 45, .15) !important;
    border-radius: 2rem !important;
    padding: .42rem 1.2rem !important;
    font-size: .7rem !important;
    font-weight: 600 !important;
    letter-spacing: .1em !important;
    text-transform: uppercase !important;
    box-shadow: none !important;
    transition: border-color .2s, color .2s, background .2s !important;
}

.sk-service-pill .wp-block-button__link:hover {
    border-color: var(--sk-pk) !important;
    color: var(--sk-pk) !important;
    background: var(--sk-pk-a) !important;
}

@media (max-width: 768px) {

    .sk-sec [style*="grid-template-columns:repeat(3"],
    .sk-halo-dark [style*="grid-template-columns:repeat(3"],
    .sk-halo-light [style*="grid-template-columns:repeat(3"],
    .sk-sec [style*="grid-template-columns:repeat(2"],
    .sk-halo-light [style*="grid-template-columns:repeat(2"] {
        grid-template-columns: 1fr !important;
    }
}

/* ── MOBILE : passage en colonne ───────────────────────────── */
@media (max-width: 768px) {

    .sk-sec-hero .is-layout-flex,
    .sk-sec-services .is-layout-flex,
    .sk-halo-dark .is-layout-flex,
    .sk-sec .is-layout-flex {
        flex-direction: column !important;
    }

    .sk-sec-hero .is-layout-grid,
    .sk-sec-services .is-layout-grid,
    .sk-sec-testimonials .is-layout-grid,
    .sk-halo-dark .is-layout-grid,
    .sk-sec .is-layout-grid {
        grid-template-columns: 1fr !important;
    }

    .sk-sec-hero .wp-block-columns,
    .sk-sec-services .wp-block-columns,
    .sk-halo-dark .wp-block-columns,
    .sk-sec .wp-block-columns {
        flex-direction: column !important;
    }

    .sk-sec-hero .wp-block-column,
    .sk-sec-services .wp-block-column,
    .sk-halo-dark .wp-block-column,
    .sk-sec .wp-block-column {
        flex-basis: 100% !important;
        max-width: 100% !important;
        width: 100% !important;
    }
}

/* ── POUR ALLER PLUS LOIN (liens articles liés) ─────────────── */

/* Padding qui crée la zone 1200px centrée (identique aux autres sk-sec).
   calc(50% - 600px) = marges latérales symétriques pour contenu de 1200px max. */
.sk-related-links.alignfull {
    padding-left: max(1.5rem, calc(50% - 600px)) !important;
    padding-right: max(1.5rem, calc(50% - 600px)) !important;
    box-sizing: border-box !important;
}

.sk-related-links .wp-block-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: .75rem !important;
}

.sk-related-links .wp-block-list li {
    border: 1px solid rgba(13, 29, 45, .1);
    border-radius: var(--sk-r);
    padding: 1rem 1.25rem;
    transition: border-color .2s, background .2s;
}

.sk-related-links .wp-block-list li:hover {
    border-color: var(--sk-pk);
    background: rgba(0, 166, 180, .03);
}

.sk-related-links .wp-block-list li a {
    color: var(--sk-nv) !important;
    text-decoration: none !important;
    font-weight: 500;
    font-size: .95rem;
    display: block;
    line-height: 1.45;
}

.sk-related-links .wp-block-list li a:hover {
    color: var(--sk-pk) !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   CORRECTIFS ESPACEMENT — suite suppression margin-block-start global
   Compense les espaces perdus : H2↔para, label↔H2, cards, boutons FAQ.
══════════════════════════════════════════════════════════════════════════════ */

/* ── sk-label → espace sous le label avant le H2 ──────────── */
.sk-label {
    margin-bottom: .75rem !important;
}

/* ── Titres H2/H3 de section → espace dessous ─────────────── */
.sk-halo-light .wp-block-heading,
.sk-sec-faq .sk-faq-left .wp-block-heading {
    margin-bottom: 1rem !important;
}

/* ── Grilles Gutenberg (is-layout-grid) — gap absent car
   --wp--style--block-gap non défini dans theme.json ────────── */
.sk-sec-services .wp-block-group.is-layout-grid,
.sk-sec-services .wp-block-group-is-layout-grid {
    gap: 1.4rem !important;
}

.sk-halo-dark .wp-block-group.is-layout-grid,
.sk-halo-dark .wp-block-group-is-layout-grid,
.sk-sec .wp-block-group.is-layout-grid,
.sk-sec .wp-block-group-is-layout-grid {
    gap: 1.25rem !important;
}

/* ── CTA : centrage + gap entre les boutons ─────────────────── */
.sk-sec-cta .wp-block-buttons {
    display: flex !important;
    justify-content: center !important;
    gap: .85rem !important;
}

/* Gap entre boutons dans tout contexte flex Gutenberg ──────── */
.sk-sec-cta .wp-block-buttons.is-layout-flex,
.sk-sec-cta .wp-block-buttons-is-layout-flex {
    gap: .85rem !important;
}

/* ── FAQ : espace au-dessus du bouton de contact ────────────── */
.sk-faq-left .wp-block-buttons {
    margin-top: 1.75rem !important;
}

/* ── Bouton primaire : sk-btn-primary ───────────────────────── */
.sk-btn-primary .wp-block-button__link {
    background: var(--sk-pk) !important;
    color: #fff !important;
    border: none !important;
    padding: .95rem 1.8rem !important;
    font-weight: 600 !important;
    box-shadow: 0 4px 14px rgba(0, 166, 180, .25) !important;
    text-decoration: none !important;
    transition: background .2s, box-shadow .2s, transform .15s !important;
    cursor: pointer !important;
}

.sk-btn-primary .wp-block-button__link:hover {
    background: var(--sk-pk-d) !important;
    box-shadow: 0 6px 20px rgba(0, 166, 180, .42) !important;
    transform: translateY(-1px) !important;
}

/* ── SERVICE CARD (sk-sec-card) ──────────────────────────────── */

/* Description */
.sk-sec-card .sk-sec-desc,
.sk-sec-card>.wp-block-paragraph:not(.sk-sec-link) {
    font-size: .85rem;
    color: var(--sk-mu);
    line-height: 1.65;
    margin: 0 !important;
}

/* Séparateur */
.sk-sec-card hr,
.sk-sec-card .wp-block-separator {
    border: none !important;
    border-top: 1px solid var(--sk-bd) !important;
    margin: .4rem 0 !important;
}

/* Liste features */
.sk-sec-card ul,
.sk-sec-card .wp-block-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex;
    flex-direction: column;
    gap: 7px;
}

/* Lien "Voir la suite →" */
.sk-sec-card .sk-sec-link,
.sk-sec-card a:not(.wp-block-button__link) {
    font-size: .9rem;
    font-weight: 600;
    color: var(--sk-pk) !important;
    text-decoration: none !important;
    margin-top: auto !important;
}

.sk-sec-card .sk-sec-link:hover,
.sk-sec-card a:not(.wp-block-button__link):hover {
    text-decoration: underline !important;
}

/* ── CLOUD COMPARISON CARDS (Sur site / IaaS / PaaS) ────────── */

.sk-cloud-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
    margin-top: 2rem;
}

@media (max-width: 900px) {
    .sk-cloud-cards {
        grid-template-columns: 1fr;
    }
}

.sk-cloud-card {
    background: #fff;
    border: 1px solid var(--sk-bd);
    border-radius: var(--sk-r);
    padding: 1.6rem;
    display: flex;
    flex-direction: column;
    gap: .85rem;
    position: relative;
}

.sk-cloud-card.dark {
    background: var(--sk-nv);
    border-color: transparent;
}

.sk-cloud-card .sk-cc-badge {
    position: absolute;
    top: 1rem;
    right: 1rem;
    background: var(--sk-pk);
    color: #fff;
    font-size: .65rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: .28rem .75rem;
    border-radius: 1rem;
}

.sk-cloud-card .sk-cc-icon {
    font-size: 2rem;
    line-height: 1;
    display: block;
}

.sk-cloud-card .sk-cc-icon img {
    width: 34px;
    height: 34px;
    object-fit: contain;
    display: block;
}

/* Icône inline (remplace un emoji dans un paragraphe) */
.sk-inline-icon {
    width: 20px;
    height: 20px;
    object-fit: contain;
    display: inline-block;
    vertical-align: -4px;
    margin-right: .2rem;
}

.sk-cloud-card .sk-cc-title {
    font-family: var(--sk-font-title);
    font-weight: 700;
    font-size: 1.35rem;
    color: var(--sk-nv);
    margin: .25rem 0 0;
    line-height: 1.15;
}

.sk-cloud-card.iaas .sk-cc-title {
    color: var(--sk-pk);
}

.sk-cloud-card.dark .sk-cc-title {
    color: #fff;
}

.sk-cloud-card .sk-cc-desc {
    font-size: .82rem;
    color: var(--sk-mu);
    line-height: 1.55;
    margin: 0;
}

.sk-cloud-card.iaas .sk-cc-desc {
    color: var(--sk-pk);
}

.sk-cloud-card.dark .sk-cc-desc {
    color: rgba(255, 255, 255, .58);
}

.sk-cloud-card .sk-cc-separator {
    border: none;
    border-top: 1px solid var(--sk-bd);
    margin: 0;
}

.sk-cloud-card.dark .sk-cc-separator {
    border-color: rgba(255, 255, 255, .1);
}

.sk-cloud-card .sk-cc-rows {
    display: flex;
    flex-direction: column;
    gap: .3rem;
}

.sk-cloud-card .sk-cc-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: .48rem .75rem;
    background: var(--sk-ow);
    border-radius: .5rem;
}

.sk-cloud-card.dark .sk-cc-row {
    background: rgba(255, 255, 255, .05);
}

.sk-cloud-card .sk-cc-row-label {
    font-size: .83rem;
    color: var(--sk-nv);
    font-weight: 500;
}

.sk-cloud-card.dark .sk-cc-row-label {
    color: rgba(255, 255, 255, .85);
}

.sk-cloud-badge-you {
    background: rgba(0, 166, 180, .1);
    color: var(--sk-pk);
    border: 1px solid rgba(0, 166, 180, .2);
    font-size: .72rem;
    font-weight: 700;
    padding: .22rem .7rem;
    border-radius: 1rem;
    white-space: nowrap;
    flex-shrink: 0;
}

.sk-cloud-badge-sk {
    background: rgba(16, 185, 129, .12);
    color: #065f46;
    border: 1px solid rgba(16, 185, 129, .22);
    font-size: .72rem;
    font-weight: 700;
    padding: .22rem .7rem;
    border-radius: 1rem;
    white-space: nowrap;
    flex-shrink: 0;
}

.sk-cloud-card .sk-cc-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .75rem;
    margin-top: auto;
    padding-top: .25rem;
}

.sk-cloud-card .sk-cc-progress-track {
    flex: 1;
    height: 4px;
    background: rgba(13, 29, 45, .1);
    border-radius: 2px;
    overflow: hidden;
}

.sk-cloud-card.dark .sk-cc-progress-track {
    background: rgba(255, 255, 255, .15);
}

.sk-cloud-card .sk-cc-progress-fill {
    height: 100%;
    background: var(--sk-pk);
    border-radius: 2px;
}

.sk-cloud-card .sk-cc-progress-text {
    font-size: .75rem;
    font-weight: 600;
    color: var(--sk-mu);
    white-space: nowrap;
}

.sk-cloud-card.dark .sk-cc-progress-text {
    color: rgba(255, 255, 255, .65);
}

/* ── VERTICAL TIMELINE (sk-timeline-v) ──────────────────────── */

.sk-timeline-v {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding-left: 2.25rem;
}

.sk-timeline-v::before {
    content: '';
    position: absolute;
    left: 5px;
    top: 18px;
    bottom: 18px;
    width: 2px;
    background: var(--sk-pk);
    border-radius: 2px;
}

.sk-tl-item {
    position: relative;
}

.sk-tl-item::before {
    content: '';
    position: absolute;
    left: -2.05rem;
    top: 14px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 2px solid var(--sk-pk);
    background: #fff;
    z-index: 1;
}

.sk-tl-card {
    background: #fff;
    border: 1px solid var(--sk-bd);
    border-radius: var(--sk-r);
    padding: 1.4rem 1.6rem;
    box-shadow: 0 2px 12px rgba(13, 29, 45, .04);
    transition: border-color .2s, box-shadow .2s;
}

.sk-tl-card:hover {
    border-color: rgba(0, 166, 180, .18);
    box-shadow: 0 6px 24px rgba(0, 166, 180, .08);
}

.sk-tl-label {
    display: block;
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--sk-pk);
    margin-bottom: .55rem;
}

.sk-tl-card h3 {
    font-family: var(--sk-font-title);
    font-weight: 700;
    font-size: 1rem;
    color: var(--sk-nv);
    margin: 0 0 .6rem;
    line-height: 1.3;
}

.sk-tl-card p {
    font-size: .85rem;
    color: var(--sk-mu);
    line-height: 1.65;
    margin: 0;
}

@media (max-width: 768px) {
    .sk-timeline-v {
        padding-left: 1.75rem;
    }

    .sk-tl-item::before {
        left: -1.6rem;
    }
}

/* ============================================================
   Founder cards — Les fondateurs (post 371)
   ============================================================ */
.sk-founder-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
    margin-top: 2rem;
}

.sk-founder-card {
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 4px 24px rgba(13, 29, 45, .1);
    border: 1px solid var(--sk-bd);
    display: flex;
    flex-direction: column;
}

.sk-founder-header {
    background: var(--sk-nv);
    padding: 1.25rem 1.4rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    position: relative;
}

.sk-founder-photo {
    width: 72px;
    height: 72px;
    border-radius: .6rem;
    object-fit: cover;
    flex-shrink: 0;
}

.sk-founder-meta {
    flex: 1;
    min-width: 0;
}

.sk-founder-name {
    font-family: var(--sk-font-title);
    font-size: 1.2rem;
    font-weight: 700;
    color: #fff;
    margin: 0 0 .2rem;
    line-height: 1.2;
}

.sk-founder-role {
    font-size: .78rem;
    color: rgba(255, 255, 255, .5);
    margin: 0;
}

.sk-founder-linkedin {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: .35rem;
    background: rgba(255, 255, 255, .1);
    border: 1px solid rgba(255, 255, 255, .15);
    color: rgba(255, 255, 255, .8) !important;
    font-size: .72rem;
    font-weight: 700;
    text-decoration: none !important;
    align-self: flex-start;
    flex-shrink: 0;
    font-style: normal;
}

.sk-founder-linkedin:hover {
    background: rgba(255, 255, 255, .2);
}

.sk-founder-divider {
    height: 3px;
    background: var(--sk-pk);
}

.sk-founder-body {
    background: #fff;
    padding: 1.4rem 1.6rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    flex: 1;
}

.sk-founder-timeline {
    display: flex;
    flex-direction: column;
    gap: .55rem;
}

.sk-founder-tl-row {
    display: flex;
    gap: .85rem;
    align-items: baseline;
}

.sk-founder-tl-year {
    font-size: .82rem;
    font-weight: 700;
    color: var(--sk-pk);
    min-width: 44px;
    flex-shrink: 0;
}

.sk-founder-tl-text {
    font-size: .85rem;
    color: var(--sk-nv);
    line-height: 1.5;
}

.sk-founder-quote {
    border-left: 3px solid var(--sk-pk);
    padding-left: 1rem;
    margin-top: .25rem;
}

.sk-founder-quote p {
    font-size: .82rem;
    font-style: italic;
    color: var(--sk-mu);
    line-height: 1.65;
    margin: 0;
}

@media (max-width: 768px) {
    .sk-founder-grid {
        grid-template-columns: 1fr;
    }
}

/* ══ PAGE CONTACT ═══════════════════════════════════════════
   Hero fond clair · canaux · formulaire · sidebar bureaux
═══════════════════════════════════════════════════════════ */

/* ── Canaux de contact (colonne droite du hero) ─────────── */

.sk-contact-list {
    display: flex !important;
    flex-direction: column !important;
    gap: .65rem !important;
}

.sk-contact-card {
    display: grid !important;
    grid-template-columns: 42px 1fr !important;
    grid-template-rows: auto auto !important;
    column-gap: .85rem !important;
    row-gap: .1rem !important;
    align-items: center !important;
    background: #fff !important;
    border: 1px solid var(--sk-bd) !important;
    border-radius: var(--sk-r-sm) !important;
    padding: .85rem 1.1rem !important;
    transition: transform .2s ease, box-shadow .2s ease;
}

.sk-contact-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 166, 180, .1);
}

.sk-contact-card figure.wp-block-image,
.sk-contact-card .wp-block-image {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    margin: 0 !important;
    max-height: none !important;
    width: 38px !important;
    align-self: center;
}

.sk-contact-card .wp-block-image img {
    width: 38px !important;
    height: 38px !important;
    max-height: 38px !important;
    object-fit: contain !important;
}

.sk-contact-card .wp-block-heading,
.sk-contact-card h3 {
    grid-column: 2 !important;
    grid-row: 1 !important;
    font-size: .9rem !important;
    font-weight: 700 !important;
    color: var(--sk-nv) !important;
    margin: 0 !important;
    line-height: 1.3 !important;
}

.sk-contact-card>p,
.sk-contact-card .wp-block-paragraph {
    grid-column: 2 !important;
    grid-row: 2 !important;
    font-size: .79rem !important;
    color: var(--sk-mu) !important;
    margin: 0 !important;
    line-height: 1.4 !important;
}

/* Variante verre dépoli quand la liste de contact est sur un hero sombre */
.sk-halo-dark .sk-contact-card {
    background: rgba(255, 255, 255, .07) !important;
    border: 1px solid rgba(255, 255, 255, .14) !important;
    backdrop-filter: blur(6px);
}

.sk-halo-dark .sk-contact-card:hover {
    background: rgba(255, 255, 255, .1) !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, .25);
}

.sk-halo-dark .sk-contact-card .wp-block-heading,
.sk-halo-dark .sk-contact-card h3 {
    color: #fff !important;
}

.sk-halo-dark .sk-contact-card>p,
.sk-halo-dark .sk-contact-card .wp-block-paragraph {
    color: rgba(255, 255, 255, .62) !important;
}

.sk-halo-dark .sk-contact-card .wp-block-paragraph a {
    color: rgba(255, 255, 255, .88) !important;
}

/* ── Colonnes 2/3 + 1/3 (section formulaire) ────────────── */

.sk-col-two-thirds,
.wp-block-group.sk-col-two-thirds {
    flex: 0 0 calc(65% - 1rem) !important;
    max-width: calc(65% - 1rem) !important;
    width: calc(65% - 1rem) !important;
    min-width: 0 !important;
}

.sk-col-one-third,
.wp-block-group.sk-col-one-third {
    flex: 0 0 calc(35% - 1rem) !important;
    max-width: calc(35% - 1rem) !important;
    width: calc(35% - 1rem) !important;
    min-width: 0 !important;
}

.is-layout-flex:has(> .sk-col-two-thirds) {
    column-gap: 2rem !important;
}

@media (max-width: 768px) {

    .sk-col-two-thirds,
    .wp-block-group.sk-col-two-thirds,
    .sk-col-one-third,
    .wp-block-group.sk-col-one-third {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        width: 100% !important;
    }
}

/* ── Section formulaire ──────────────────────────────────── */

.sk-form-card {
    background: #fff !important;
    border: 1px solid var(--sk-bd) !important;
    border-radius: var(--sk-r) !important;
    padding: 2.5rem !important;
    box-shadow: 0 4px 24px rgba(13, 29, 45, .06) !important;
}

.sk-form-card h2,
.sk-form-card .wp-block-heading {
    color: var(--sk-nv) !important;
    margin-bottom: .75rem !important;
}

.sk-form-card>p,
.sk-form-card .wp-block-paragraph {
    color: var(--sk-mu) !important;
    font-size: .9rem !important;
    line-height: 1.65 !important;
    margin-bottom: 1rem !important;
}

.sk-contact-sidebar {
    display: flex !important;
    flex-direction: column !important;
    gap: 1.25rem !important;
}

/* ── WPForms — champs du formulaire ─────────────────────── */

.sk-form-card .wpforms-field-label {
    display: block !important;
    font-size: .78rem !important;
    font-weight: 700 !important;
    color: var(--sk-nv) !important;
    margin-bottom: .38rem !important;
    letter-spacing: .01em !important;
}

.sk-form-card .wpforms-required-label {
    color: var(--sk-pk) !important;
    margin-left: 2px !important;
}

.sk-form-card .wpforms-field input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
.sk-form-card .wpforms-field textarea,
.sk-form-card .wpforms-field select {
    width: 100% !important;
    border: 1.5px solid rgba(0, 166, 180, .14) !important;
    border-radius: .65rem !important;
    padding: .72rem 1rem !important;
    font-size: .88rem !important;
    color: var(--sk-nv) !important;
    background: var(--sk-ow) !important;
    font-family: var(--sk-font-body) !important;
    transition: border-color .18s ease, box-shadow .18s ease !important;
    outline: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    box-shadow: none !important;
}

.sk-form-card .wpforms-field input::placeholder,
.sk-form-card .wpforms-field textarea::placeholder {
    color: rgba(107, 114, 128, .55) !important;
}

.sk-form-card .wpforms-field input:focus:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
.sk-form-card .wpforms-field textarea:focus,
.sk-form-card .wpforms-field select:focus {
    border-color: var(--sk-pk) !important;
    box-shadow: 0 0 0 3px rgba(0, 166, 180, .1) !important;
}

.sk-form-card .wpforms-field textarea {
    resize: vertical !important;
    min-height: 130px !important;
}

.sk-form-card .wpforms-field select {
    padding-right: 2.5rem !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236b7280' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 1rem center !important;
}

.sk-form-card .wpforms-field-row {
    gap: 1rem !important;
}

.sk-form-card .wpforms-submit-container {
    margin-top: 1.5rem !important;
}

.sk-form-card .wpforms-submit {
    width: 100% !important;
    background: var(--sk-pk) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 2rem !important;
    padding: .9rem 2rem !important;
    font-weight: 700 !important;
    font-size: 1rem !important;
    cursor: pointer !important;
    font-family: var(--sk-font-body) !important;
    transition: background .2s ease, transform .15s ease !important;
    letter-spacing: .01em !important;
}

.sk-form-card .wpforms-submit:hover {
    background: var(--sk-pk-d) !important;
    transform: translateY(-1px) !important;
}

/* Checkbox RGPD */
.sk-form-card .wpforms-field-checkbox label,
.sk-form-card .wpforms-field-gdpr-checkbox label {
    font-size: .82rem !important;
    color: var(--sk-mu) !important;
}

/* ── Carte urgence (fond rose pâle) ──────────────────────── */

.sk-urgency-card {
    background: rgba(0, 166, 180, .05) !important;
    border: 1px solid rgba(0, 166, 180, .18) !important;
}

.sk-urgency-card .wp-block-heading,
.sk-urgency-card h3 {
    color: var(--sk-nv) !important;
}

.sk-urgency-card>p,
.sk-urgency-card .wp-block-paragraph {
    color: var(--sk-mu) !important;
    font-size: .85rem !important;
}

/* Badge urgence */
.sk-urgency-card .sk-urgency-badge {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    background: var(--sk-pk);
    color: #fff !important;
    font-size: .7rem !important;
    font-weight: 800 !important;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: .25rem .7rem;
    border-radius: 2rem;
    margin-bottom: .75rem;
}

/* ── Card horaires — séparateurs ────────────────────────── */

.sk-hours-card .wp-block-heading {
    border-bottom: 1px solid var(--sk-bd) !important;
    padding-bottom: .75rem !important;
    margin-bottom: .75rem !important;
}

/* Trait sous Vendredi (avant-dernière ligne) */
.sk-hours-table tbody tr:nth-last-child(2) td {
    border-bottom: 1px solid var(--sk-bd) !important;
    padding-bottom: .55rem !important;
}

.sk-hours-table tbody tr:last-child td {
    padding-top: .55rem !important;
}

/* ── Tableau horaires ────────────────────────────────────── */

.sk-hours-table {
    width: 100% !important;
    margin: .5rem 0 0 !important;
    overflow: hidden !important;
}

.sk-hours-table table {
    width: 100% !important;
    border-collapse: collapse !important;
    border: none !important;
}

.sk-hours-table td {
    padding: .42rem 0 !important;
    border: none !important;
    font-size: .84rem !important;
    color: var(--sk-nv) !important;
    line-height: 1.4 !important;
    background: transparent !important;
    vertical-align: middle !important;
}

.sk-hours-table td:first-child {
    text-align: left !important;
    color: var(--sk-nv) !important;
}

.sk-hours-table td:last-child {
    text-align: right !important;
    font-weight: 600 !important;
    color: var(--sk-nv) !important;
}

/* Samedi – Dimanche : grisé */
.sk-hours-table tbody tr:last-child td {
    color: var(--sk-mu) !important;
    font-weight: 400 !important;
    padding-bottom: .65rem !important;
    border-bottom: 1px solid var(--sk-bd) !important;
}

/* Note astreinte sous le tableau */
.sk-rse-card .sk-hours-table+.wp-block-paragraph,
.sk-rse-card figure.sk-hours-table~.wp-block-paragraph {
    font-size: .76rem !important;
    color: var(--sk-mu) !important;
    line-height: 1.55 !important;
    margin-top: .65rem !important;
    margin-bottom: 0 !important;
}

/* ── Cards bureau (Siège social + Pays Basque) ───────────── */

.sk-office-card {
    padding: 1.5rem 1.6rem !important;
}

.sk-office-card h3 {
    font-size: .95rem !important;
    font-weight: 700 !important;
    color: var(--sk-nv) !important;
    margin: 0 0 1.1rem !important;
    line-height: 1.3 !important;
}

.sk-office-row {
    margin-bottom: .7rem;
}

.sk-office-row:last-child {
    margin-bottom: 0;
}

.sk-office-card .sk-office-label,
.sk-rse-card .sk-office-label {
    font-size: .62rem !important;
    font-weight: 700 !important;
    letter-spacing: .1em !important;
    text-transform: uppercase !important;
    color: var(--sk-mu) !important;
    margin: 0 0 .18rem !important;
    line-height: 1 !important;
}

.sk-office-card .sk-office-value,
.sk-rse-card .sk-office-value {
    font-size: .88rem !important;
    color: var(--sk-nv) !important;
    margin: 0 !important;
    font-weight: 500 !important;
    line-height: 1.55 !important;
}

.sk-office-card .sk-office-value a,
.sk-rse-card .sk-office-value a {
    color: var(--sk-pk) !important;
    text-decoration: none !important;
}

.sk-office-card .sk-office-value a:hover,
.sk-rse-card .sk-office-value a:hover {
    text-decoration: underline !important;
}

/* Variante sombre (Pays Basque) */
.sk-office-dark {
    background: var(--sk-nv) !important;
}

.sk-office-dark h3,
.sk-office-dark .wp-block-heading,
.sk-office-dark .sk-office-value,
.sk-office-dark .sk-rse-card .sk-office-value {
    color: rgba(255, 255, 255, .95) !important;
}

/* Écrase .sk-rse-card .wp-block-paragraph sur fond sombre */
.sk-office-dark .wp-block-paragraph {
    color: rgba(255, 255, 255, .95) !important;
}

.sk-office-dark .sk-office-label {
    color: rgba(255, 255, 255, .4) !important;
}

.sk-office-dark .sk-office-value a,
.sk-office-dark .wp-block-paragraph a {
    color: #ff8ec7 !important;
}

@media (max-width: 768px) {

    .sk-form-card {
        padding: 1.5rem !important;
    }
}

/* ══ PAGE 404 ══════════════════════════════════════════════════ */

@keyframes sk404Float {

    0%,
    100% {
        transform: translateY(0) rotate(-3deg);
    }

    50% {
        transform: translateY(-18px) rotate(3deg);
    }
}

@keyframes sk404Smoke {
    0% {
        opacity: .7;
        transform: translateX(0) translateY(0) scale(1);
    }

    100% {
        opacity: 0;
        transform: translateX(-18px) translateY(8px) scale(2.2);
    }
}

@keyframes sk404GlowPulse {

    0%,
    100% {
        opacity: .18;
        transform: scale(1);
    }

    50% {
        opacity: .32;
        transform: scale(1.08);
    }
}

@keyframes sk404WatermarkIn {
    from {
        opacity: 0;
        letter-spacing: .6em;
    }

    to {
        opacity: 1;
        letter-spacing: .35em;
    }
}

.sk-404-page {
    position: relative;
    min-height: calc(100vh - 106px);
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--sk-nv);
    overflow: hidden;
}

/* Fond */
.sk-404-bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}

.sk-404-grid {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, .025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .025) 1px, transparent 1px);
    background-size: 52px 52px;
}

.sk-404-glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(72px);
    animation: sk404GlowPulse 5s ease-in-out infinite;
}

.sk-404-glow--1 {
    width: 520px;
    height: 520px;
    background: radial-gradient(circle, rgba(0, 166, 180, .28), transparent 70%);
    top: -120px;
    right: -80px;
    animation-delay: 0s;
}

.sk-404-glow--2 {
    width: 380px;
    height: 380px;
    background: radial-gradient(circle, rgba(0, 166, 180, .14), transparent 70%);
    bottom: -60px;
    left: -60px;
    animation-delay: 2.5s;
}

.sk-404-watermark {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--sk-font-title);
    font-weight: 900;
    font-size: clamp(12rem, 28vw, 22rem);
    color: rgba(255, 255, 255, .03);
    letter-spacing: .35em;
    user-select: none;
    animation: sk404WatermarkIn 1.2s ease both;
}

/* Contenu */
.sk-404-inner {
    position: relative;
    z-index: 1;
    text-align: center;
    padding: 5rem 1.5rem;
    max-width: 720px;
    margin: 0 auto;
}

.sk-404-badge {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    background: rgba(0, 166, 180, .15);
    border: 1px solid rgba(0, 166, 180, .4);
    color: #ff8ec7;
    padding: .32rem 1rem;
    border-radius: 2rem;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    margin-bottom: 2rem;
    backdrop-filter: blur(4px);
}

.sk-404-dot {
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--sk-pk-l);
    animation: simple-glow 2s ease-in-out infinite;
}

.sk-404-title {
    font-family: var(--sk-font-title);
    font-size: clamp(1.8rem, 4.5vw, 3rem);
    font-weight: 800;
    color: #fff;
    line-height: 1.15;
    margin-bottom: 1.25rem;
}

.sk-404-title em {
    font-style: normal;
    color: var(--sk-pk-l);
}

.sk-404-desc {
    font-size: 1rem;
    color: rgba(255, 255, 255, .55);
    line-height: 1.75;
    margin-bottom: 2.5rem;
}

/* Rocket */
.sk-404-rocket {
    position: relative;
    display: inline-flex;
    align-items: flex-end;
    gap: 4px;
    margin-bottom: 2.5rem;
    animation: sk404Float 4s ease-in-out infinite;
}

.sk-404-rocket-body {
    font-size: 3rem;
    filter: drop-shadow(0 0 18px rgba(0, 166, 180, .6));
    line-height: 1;
    transform: rotate(45deg);
    display: block;
}

.sk-404-smoke {
    display: inline-block;
    font-size: 1.4rem;
    color: rgba(255, 255, 255, .4);
    animation: sk404Smoke 1s ease-out infinite;
    transform-origin: center;
}

.sk-404-smoke--2 {
    font-size: 1rem;
    animation-delay: .3s;
    color: rgba(255, 255, 255, .25);
}

.sk-404-smoke--3 {
    font-size: .7rem;
    animation-delay: .6s;
    color: rgba(255, 255, 255, .15);
}

/* Boutons */
.sk-404-links {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    justify-content: center;
    margin-bottom: 3rem;
}

.sk-404-btn {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .72rem 1.6rem;
    border-radius: 2rem;
    font-size: .9rem;
    font-weight: 600;
    text-decoration: none;
    transition: all .25s ease;
    white-space: nowrap;
}

.sk-404-btn--primary {
    background: var(--sk-pk);
    color: #fff;
    box-shadow: 0 4px 22px rgba(0, 166, 180, .45);
}

.sk-404-btn--primary:hover {
    background: var(--sk-pk-l);
    transform: translateY(-2px);
    box-shadow: 0 8px 32px rgba(0, 166, 180, .55);
    color: #fff;
}

.sk-404-btn--ghost {
    background: rgba(255, 255, 255, .07);
    color: rgba(255, 255, 255, .8);
    border: 1px solid rgba(255, 255, 255, .15);
}

.sk-404-btn--ghost:hover {
    background: rgba(255, 255, 255, .13);
    border-color: rgba(255, 255, 255, .3);
    color: #fff;
    transform: translateY(-2px);
}

/* Suggestions */
.sk-404-suggestions {
    border-top: 1px solid rgba(255, 255, 255, .08);
    padding-top: 2rem;
}

.sk-404-suggestions-label {
    font-size: .78rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .35);
    margin-bottom: 1rem;
}

.sk-404-chips {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    justify-content: center;
}

.sk-404-chip {
    display: inline-block;
    padding: .35rem .9rem;
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 1.5rem;
    font-size: .8rem;
    color: rgba(255, 255, 255, .6);
    text-decoration: none;
    transition: all .2s ease;
}

.sk-404-chip:hover {
    background: rgba(0, 166, 180, .18);
    border-color: rgba(0, 166, 180, .45);
    color: #ff8ec7;
    transform: translateY(-1px);
}

@media (max-width: 768px) {
    .sk-404-page {
        min-height: calc(100vh - 70px);
    }

    .sk-404-inner {
        padding: 3rem 1.25rem;
    }

    .sk-404-rocket-body {
        font-size: 2.2rem;
    }
}

/* ── CAS CONCRETS (bandeau titre + 5 cartes) ─────────────────── */
.sk-usecases-row {
    align-items: center !important;
    gap: 2.5rem !important;
}

.sk-usecases-title {
    flex: 0 0 260px !important;
}

.sk-usecases-title .wp-block-heading {
    font-size: 1.7rem !important;
    line-height: 1.25 !important;
    margin: 0 !important;
    color: var(--sk-nv);
}

.sk-usecases-title .wp-block-heading em {
    color: var(--sk-pk) !important;
    font-style: normal !important;
}

.sk-usecases-cards {
    flex: 1 1 auto !important;
    gap: 1rem !important;
    flex-wrap: nowrap !important;
}

.sk-usecase-card {
    position: relative;
    flex: 1 1 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center;
    border: 1px solid var(--sk-bd);
    border-radius: var(--sk-r);
    padding: 1.5rem 1.1rem;
    background: #fff;
    box-shadow: 0 1px 6px rgba(13, 29, 45, .04);
    transition: transform .3s cubic-bezier(.22, 1, .36, 1), box-shadow .3s ease, border-color .3s ease;
}

.sk-usecase-card-link {
    position: absolute;
    inset: 0;
    z-index: 2;
    border-radius: inherit;
}

.sk-usecase-card:has(.sk-usecase-card-link) {
    cursor: pointer;
}

.sk-usecase-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 14px 34px rgba(0, 166, 180, .14);
    border-color: rgba(0, 166, 180, .2);
}

.sk-usecase-icon.wp-block-image {
    width: 56px !important;
    height: 56px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.1rem !important;
    position: relative;
}

.sk-usecase-icon.wp-block-image::before {
    content: '';
    position: absolute;
    inset: -10px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0, 166, 180, .18) 0%, transparent 72%);
    opacity: .7;
    transform: scale(.85);
    transition: opacity .35s ease, transform .35s ease;
}

.sk-usecase-card:hover .sk-usecase-icon.wp-block-image::before {
    opacity: 1;
    transform: scale(1.15);
}

.sk-usecase-icon img {
    width: 40px !important;
    height: 40px !important;
    max-width: 40px !important;
    object-fit: contain;
    position: relative;
    z-index: 1;
    transition: transform .4s cubic-bezier(.34, 1.56, .64, 1);
}

.sk-usecase-card:hover .sk-usecase-icon img {
    transform: scale(1.1) rotate(-6deg);
}

.sk-usecase-card .wp-block-heading {
    font-size: .92rem !important;
    font-weight: 700 !important;
    color: var(--sk-nv) !important;
    margin: 0 0 .4rem !important;
    line-height: 1.3 !important;
}

.sk-usecase-card p {
    font-size: .78rem !important;
    line-height: 1.5 !important;
    color: var(--sk-mu) !important;
    margin: 0 !important;
}

@media (max-width: 900px) {
    .sk-usecases-row {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 1.75rem !important;
    }

    .sk-usecases-title {
        flex: 0 0 auto !important;
    }

    .sk-usecases-cards {
        flex-wrap: wrap !important;
        width: 100%;
    }

    .sk-usecase-card {
        flex: 1 1 calc(50% - .5rem) !important;
        min-width: 150px;
    }
}

@media (max-width: 560px) {
    .sk-usecase-card {
        flex: 1 1 100% !important;
    }
}

/* ── APPROCHE IA (mockup dashboard + assistant) ──────────────── */
.sk-ia-approach-row {
    align-items: center !important;
    gap: 3.5rem !important;
    padding: 1rem 0;
}

.sk-ia-check {
    display: flex !important;
    align-items: flex-start;
    gap: .65rem;
    font-size: .95rem !important;
    line-height: 1.5 !important;
    color: var(--sk-nv) !important;
    margin: 0 0 .85rem !important;
}

.sk-ia-check:last-child {
    margin-bottom: 0 !important;
}

.sk-ia-check strong {
    color: var(--sk-pk);
    font-weight: 700;
}

.sk-ia-check::before {
    content: '✓';
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    min-width: 20px;
    border-radius: 50%;
    border: 1.5px solid var(--sk-pk);
    color: var(--sk-pk);
    font-size: .68rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 2px;
}

/* Visuel mockup (bloc décoratif) */

.sk-iamock-item.is-active {
    color: #fff;
    font-weight: 700;
}

.sk-iamock-item.is-active .sk-iamock-dot {
    background: var(--sk-pk-l);
}

.sk-iamock-bubble.is-grey {
    background: #f2f3f6;
}

.sk-iamock-bubble.is-pink {
    background: var(--sk-pk-a);
    color: var(--sk-pk);
    margin-bottom: 0;
}

@media (max-width: 900px) {
    .sk-ia-approach-row {
        flex-direction: column !important;
        gap: 2.5rem !important;
    }

}

/* ── DÉVELOPPEMENT SUR MESURE (bandeau dynamisé, style hero) ─── */
.sk-dev-heading-row {
    display: flex;
    align-items: center;
    gap: .6rem;
    margin: 0 0 1.25rem !important;
}

.sk-dev-heading-row .wp-block-heading {
    margin: 0 !important;
}

.sk-dev-spark {
    color: var(--sk-pk-l);
    font-size: 1.2rem;
    flex-shrink: 0;
}

.sk-dev-devices {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: .9rem;
    width: 100%;
}

.sk-dev-device-card {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: .85rem !important;
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 14px;
    padding: 1.1rem 1.1rem;
    backdrop-filter: blur(6px);
    transition: transform .3s cubic-bezier(.22, 1, .36, 1), background .3s ease, border-color .3s ease, box-shadow .3s ease;
}

.sk-dev-device-card:hover {
    transform: translateY(-4px);
    background: rgba(0, 166, 180, .12);
    border-color: rgba(0, 166, 180, .4);
    box-shadow: 0 14px 30px rgba(0, 166, 180, .18);
}

.sk-dev-device-icon.wp-block-image {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px;
    border-radius: 50%;
    background: rgba(0, 166, 180, .18);
    display: flex !important;
    align-items: center;
    justify-content: center;
    margin: 0 !important;
    flex-shrink: 0;
    position: relative;
}

.sk-dev-device-icon.wp-block-image::before {
    content: '';
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0, 166, 180, .35) 0%, transparent 72%);
    opacity: .6;
    transform: scale(.85);
    transition: opacity .35s ease, transform .35s ease;
    z-index: 0;
}

.sk-dev-device-card:hover .sk-dev-device-icon.wp-block-image::before {
    opacity: 1;
    transform: scale(1.2);
}

.sk-dev-device-icon img {
    width: 22px !important;
    height: 22px !important;
    max-width: 22px !important;
    object-fit: contain;
    position: relative;
    z-index: 1;
    transition: transform .4s cubic-bezier(.34, 1.56, .64, 1);
}

.sk-dev-device-card:hover .sk-dev-device-icon img {
    transform: scale(1.12) rotate(-6deg);
}

.sk-dev-device-card p {
    font-size: .85rem !important;
    font-weight: 600 !important;
    color: #fff !important;
    margin: 0 !important;
    line-height: 1.3 !important;
}

/* ── PARTENAIRES (liste texte, sans cartes) ──────────────────── */

.sk-partner-list {
    display: flex;
    flex-direction: column;
}

.sk-partner-row {
    position: relative;
    display: flex;
    align-items: center;
    gap: 1.75rem;
    padding: 1.85rem 0;
    border-bottom: 1px solid var(--sk-bd);
    transition: padding-left .3s cubic-bezier(.22, 1, .36, 1), background .3s ease;
}

.sk-partner-row:first-child {
    border-top: 1px solid var(--sk-bd);
}

.sk-partner-logo.wp-block-image {
    flex: 0 0 96px;
    width: 96px;
    height: 56px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    margin: 0 !important;
}

.sk-partner-logo img {
    max-width: 96px !important;
    max-height: 56px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain;
    transition: transform .35s cubic-bezier(.34, 1.56, .64, 1);
}

.sk-partner-row:hover .sk-partner-logo img {
    transform: scale(1.06);
}

@media (max-width: 700px) {
    .sk-partner-logo.wp-block-image {
        flex: 0 0 72px;
        width: 72px;
        height: 44px;
    }
}

.sk-partner-row:hover {
    padding-left: 1.1rem;
    background: rgba(0, 166, 180, .035);
}

.sk-partner-link {
    position: absolute;
    inset: 0;
    z-index: 2;
    border-radius: inherit;
}

.sk-partner-kicker {
    flex: 0 0 150px;
    font-family: var(--sk-font-title) !important;
    font-size: .7rem !important;
    font-weight: 700 !important;
    letter-spacing: .09em !important;
    text-transform: uppercase !important;
    color: var(--sk-pk) !important;
    margin: 0 !important;
    line-height: 1.4 !important;
}

.sk-partner-body {
    flex: 1 1 auto;
    min-width: 0;
}

.sk-partner-name {
    font-family: var(--sk-font-title) !important;
    font-weight: 800 !important;
    font-size: 1.35rem !important;
    color: var(--sk-nv) !important;
    margin: 0 0 .4rem !important;
    line-height: 1.2 !important;
    transition: color .25s ease;
}

.sk-partner-row:hover .sk-partner-name {
    color: var(--sk-pk) !important;
}

.sk-partner-desc {
    color: var(--sk-mu) !important;
    font-size: .92rem !important;
    line-height: 1.65 !important;
    margin: 0 !important;
}

.sk-partner-arrow {
    position: relative;
    z-index: 1;
    flex: 0 0 auto;
    font-size: 1.5rem;
    font-weight: 400;
    color: var(--sk-pk);
    transition: transform .35s cubic-bezier(.34, 1.56, .64, 1);
}

.sk-partner-row:hover .sk-partner-arrow {
    transform: translateX(7px);
}

@media (max-width: 700px) {
    .sk-partner-row {
        flex-wrap: wrap;
        gap: .6rem;
    }

    .sk-partner-kicker {
        flex: 0 0 100%;
    }

    .sk-partner-arrow {
        display: none;
    }
}

@media (max-width: 600px) {
    .sk-dev-devices {
        grid-template-columns: 1fr;
    }
}