
.ip13-ref-page {
    background:#ffffff;
    color:#151515;
}

.ip13-ref-page .container {
    width:min(1180px,calc(100% - 40px));
    margin:0 auto;
}

.ip13-ref-eyebrow {
    margin:0 0 15px;

    color:#6689ff;

    font-size:.66rem;
    line-height:1.4;
    font-weight:950;
    letter-spacing:.14em;
    text-transform:uppercase;
}


/* =========================================================
   HERO
========================================================= */

.ip13-ref-hero {
    overflow:hidden;

    padding:76px 0 72px;

    border-bottom:1px solid rgba(0, 0, 0,.05);

    background:radial-gradient(
            circle at 82% 30%,
            rgba(124,58,237,.16),
            transparent 35%
        ),
        #ffffff;
}

.ip13-ref-hero__content {
    display:grid;

    grid-template-columns:minmax(0,.9fr)
        minmax(440px,1.1fr);

    gap:58px;

    align-items:center;
}

.ip13-ref-hero h1 {
    max-width:720px;

    margin:0;

    color:#151515;

    font-size:clamp(3rem,5.6vw,5.3rem);
    font-weight:950;
    line-height:.96;
    letter-spacing:-.055em;
}

.ip13-ref-hero h1 span {
    display:block;

    margin-top:8px;

    color:#9b4dff;
}

.ip13-ref-hero__lead {
    max-width:720px;

    margin:27px 0 0;

    color:#c0bacb;

    font-size:1rem;
    line-height:1.75;
}

.ip13-ref-hero__sub {
    max-width:720px;

    margin:14px 0 0;

    color:#858191;

    font-size:.8rem;
    line-height:1.7;
}

.ip13-ref-actions {
    display:flex;
    flex-wrap:wrap;

    gap:10px;

    margin-top:28px;
}

.ip13-ref-btn {
    display:inline-flex;

    min-height:48px;

    align-items:center;
    justify-content:center;

    padding:11px 19px;

    border-radius:9px;

    text-decoration:none !important;

    font-size:.75rem;
    font-weight:900;

    transition:transform .2s ease,
        border-color .2s ease;
}

.ip13-ref-btn:hover {
    transform:translateY(-2px);
}

.ip13-ref-btn--primary {
    border:1px solid #6689ff;

    background:linear-gradient(
            135deg,
            #1d3fd1,
            #2b52e0
        );

    color:#fff;
}

.ip13-ref-btn--ghost {
    border:1px solid rgba(0, 0, 0,.11);

    background:rgba(255,255,255,.025);

    color:#151515;
}

.ip13-ref-tags {
    display:flex;
    flex-wrap:wrap;

    gap:6px;

    margin-top:28px;
}

.ip13-ref-tags span {
    padding:6px 9px;

    border:1px solid rgba(102,137,255,.17);
    border-radius:6px;

    background:rgba(102,137,255,.045);

    color:#918b9d;

    font-size:.59rem;
    font-weight:800;
}

.ip13-ref-hero__visual {
    overflow:hidden;

    border:1px solid rgba(102,137,255,.18);
    border-radius:18px;

    background:#f5f7fb;

    box-shadow:0 30px 90px rgba(0,0,0,.40),
        0 0 45px rgba(29,63,209,.10);
}

.ip13-ref-hero__visual img {
    display:block;

    width:100%;
    height:auto;
}


/* =========================================================
   GENERAL
========================================================= */

.ip13-ref-section {
    padding:78px 0;
}

.ip13-ref-section--alternate {
    border-top:1px solid rgba(0, 0, 0,.04);
    border-bottom:1px solid rgba(0, 0, 0,.04);

    background:#ffffff;
}

.ip13-ref-heading {
    max-width:800px;

    margin:0 auto 38px;

    text-align:center;
}

.ip13-ref-heading h2,
.ip13-ref-split h2,
.ip13-ref-final h2 {
    margin:0;

    color:#151515;

    font-size:clamp(2rem,4vw,3rem);
    font-weight:900;
    line-height:1.08;
    letter-spacing:-.04em;
}

.ip13-ref-heading > p:last-child {
    max-width:720px;

    margin:16px auto 0;

    color:#918d9e;

    font-size:.88rem;
    line-height:1.75;
}


/* =========================================================
   FOUNDATIONS
========================================================= */

.ip13-ref-foundations {
    display:grid;

    grid-template-columns:repeat(4,minmax(0,1fr));

    gap:12px;
}

.ip13-ref-foundations article {
    padding:22px;

    border:1px solid rgba(0, 0, 0,.065);
    border-radius:12px;

    background:#ffffff;
}

.ip13-ref-foundations strong {
    display:inline-flex;

    min-width:38px;
    height:28px;

    align-items:center;
    justify-content:center;

    border:1px solid rgba(102,137,255,.4);
    border-radius:7px;

    color:#a9bfff;

    font-size:.65rem;
}

.ip13-ref-foundations h3 {
    margin:17px 0 8px;

    color:#151515;

    font-size:.98rem;
}

.ip13-ref-foundations p {
    margin:0;

    color:#85808f;

    font-size:.75rem;
    line-height:1.65;
}


/* =========================================================
   EXPERTISES
========================================================= */

.ip13-ref-expertises {
    display:grid;

    grid-template-columns:repeat(2,minmax(0,1fr));

    gap:13px;
}

.ip13-ref-expertises article {
    position:relative;

    padding:27px;

    border:1px solid rgba(0, 0, 0,.07);
    border-radius:14px;

    background:radial-gradient(
            circle at 100% 0,
            rgba(102,137,255,.065),
            transparent 36%
        ),
        #ffffff;
}

.ip13-ref-number {
    display:inline-flex;

    min-width:42px;
    min-height:29px;

    align-items:center;
    justify-content:center;

    border:1px solid rgba(102,137,255,.5);
    border-radius:7px;

    color:#a9bfff;

    background:rgba(102,137,255,.08);

    font-size:.65rem;
    font-weight:950;
}

.ip13-ref-expertises h3 {
    margin:18px 0 9px;

    color:#151515;

    font-size:1.12rem;
}

.ip13-ref-expertises > article > p {
    margin:0;

    color:#9691a3;

    font-size:.8rem;
    line-height:1.7;
}

.ip13-ref-expertises ul {
    display:grid;

    grid-template-columns:repeat(2,minmax(0,1fr));

    gap:6px;

    margin:18px 0;
    padding:0;

    list-style:none;
}

.ip13-ref-expertises li {
    position:relative;

    padding-left:14px;

    color:#777381;

    font-size:.67rem;
}

.ip13-ref-expertises li::before {
    content:"";

    position:absolute;

    left:0;
    top:.48em;

    width:5px;
    height:5px;

    border-radius:50%;

    background:#2b52e0;
}

.ip13-ref-expertises a {
    display:inline-block;

    margin-top:4px;

    color:#2f5fff;

    font-size:.7rem;
    font-weight:850;

    text-decoration:none;
}


/* =========================================================
   SPLITS
========================================================= */

.ip13-ref-split {
    display:grid;

    grid-template-columns:minmax(0,1fr)
        minmax(350px,.8fr);

    gap:65px;

    align-items:center;
}

.ip13-ref-split > div:first-child > p:not(.ip13-ref-eyebrow) {
    color:#9893a3;

    font-size:.84rem;
    line-height:1.75;
}


/* =========================================================
   SEO / SEA
========================================================= */

.ip13-ref-comparison {
    display:grid;

    gap:10px;
}

.ip13-ref-comparison > div {
    padding:22px;

    border:1px solid rgba(0, 0, 0,.07);
    border-radius:12px;

    background:#ffffff;
}

.ip13-ref-comparison span {
    display:inline-flex;

    padding:5px 9px;

    border-radius:6px;

    background:rgba(102,137,255,.10);
    color:#2f5fff;

    font-size:.6rem;
    font-weight:950;
}

.ip13-ref-comparison strong {
    display:block;

    margin-top:11px;

    color:#151515;

    font-size:.9rem;
}

.ip13-ref-comparison p {
    margin:6px 0 0;

    color:#817c8d;

    font-size:.72rem;
    line-height:1.6;
}


/* =========================================================
   AUDIT
========================================================= */

.ip13-ref-audit {
    display:grid;

    grid-template-columns:repeat(5,minmax(0,1fr));

    gap:10px;
}

.ip13-ref-audit > div {
    padding:18px;

    border:1px solid rgba(0, 0, 0,.065);
    border-radius:10px;

    background:#ffffff;
}

.ip13-ref-audit strong {
    display:block;

    color:#a9bfff;

    font-size:.74rem;
}

.ip13-ref-audit p {
    margin:6px 0 0;

    color:#777281;

    font-size:.66rem;
    line-height:1.55;
}


/* =========================================================
   PROCESS
========================================================= */

.ip13-ref-process {
    display:grid;

    grid-template-columns:repeat(6,minmax(0,1fr));

    gap:10px;
}

.ip13-ref-process article {
    padding:19px;

    border:1px solid rgba(0, 0, 0,.065);
    border-radius:11px;

    background:#ffffff;
}

.ip13-ref-process strong {
    color:#2b52e0;

    font-size:.68rem;
}

.ip13-ref-process h3 {
    margin:13px 0 7px;

    color:#151515;

    font-size:.88rem;
}

.ip13-ref-process p {
    margin:0;

    color:#7f7a89;

    font-size:.68rem;
    line-height:1.55;
}


/* =========================================================
   PROMISES
========================================================= */

.ip13-ref-promises {
    display:grid;

    gap:9px;
}

.ip13-ref-promises > div {
    display:grid;

    grid-template-columns:31px 1fr;

    gap:12px;

    padding:16px;

    border:1px solid rgba(0, 0, 0,.065);
    border-radius:10px;

    background:#ffffff;
}

.ip13-ref-promises span {
    display:grid;

    width:29px;
    height:29px;

    place-items:center;

    border-radius:7px;

    background:rgba(102,137,255,.09);

    color:#2f5fff;

    font-weight:900;
}

.ip13-ref-promises p {
    margin:0;

    color:#85808f;

    font-size:.73rem;
    line-height:1.55;
}

.ip13-ref-promises strong {
    display:block;

    margin-bottom:3px;

    color:#151515;
}


/* =========================================================
   FAQ
========================================================= */

.ip13-ref-faq {
    max-width:900px;

    margin:0 auto;

    border-top:1px solid rgba(0, 0, 0,.075);
}

.ip13-ref-faq details {
    border-bottom:1px solid rgba(0, 0, 0,.075);
}

.ip13-ref-faq summary {
    position:relative;

    padding:21px 48px 21px 0;

    color:#151515;

    cursor:pointer;
    list-style:none;

    font-size:.86rem;
    font-weight:850;
}

.ip13-ref-faq summary::-webkit-details-marker {
    display:none;
}

.ip13-ref-faq summary::after {
    content:"+";

    position:absolute;

    right:2px;
    top:14px;

    display:grid;

    width:32px;
    height:32px;

    place-items:center;

    border:1px solid rgba(102,137,255,.28);
    border-radius:8px;

    color:#2f5fff;
}

.ip13-ref-faq details[open] summary::after {
    content:"−";
}

.ip13-ref-faq details p {
    margin:-2px 0 22px;

    color:#918c9d;

    font-size:.78rem;
    line-height:1.75;
}


/* =========================================================
   FINAL CTA
========================================================= */

.ip13-ref-final {
    padding:0 0 82px;
}

.ip13-ref-final__box {
    display:flex;

    align-items:center;
    justify-content:space-between;

    gap:40px;

    padding:36px;

    border:1px solid rgba(102,137,255,.22);
    border-radius:16px;

    background:radial-gradient(
            circle at 100% 0,
            rgba(102,137,255,.10),
            transparent 38%
        ),
        #ffffff;
}

.ip13-ref-final__box > div {
    max-width:720px;
}

.ip13-ref-final__box p:last-child {
    margin:13px 0 0;

    color:#918c9d;

    font-size:.8rem;
    line-height:1.7;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media(max-width:1050px) {

    .ip13-ref-hero__content {
        grid-template-columns:1fr;
    }

    .ip13-ref-hero__visual {
        max-width:850px;
    }

    .ip13-ref-foundations {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .ip13-ref-audit {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .ip13-ref-process {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

}


@media(max-width:800px) {

    .ip13-ref-expertises,
    .ip13-ref-split {
        grid-template-columns:1fr;
    }

    .ip13-ref-split {
        gap:35px;
    }

}


@media(max-width:650px) {

    .ip13-ref-page .container {
        width:calc(100% - 24px);
    }

    .ip13-ref-hero {
        padding:52px 0 55px;
    }

    .ip13-ref-hero h1 {
        font-size:clamp(2.5rem,13vw,4rem);
    }

    .ip13-ref-actions {
        display:grid;
    }

    .ip13-ref-btn {
        width:100%;
    }

    .ip13-ref-section {
        padding:56px 0;
    }

    .ip13-ref-foundations,
    .ip13-ref-audit,
    .ip13-ref-process {
        grid-template-columns:1fr;
    }

    .ip13-ref-expertises article {
        padding:21px;
    }

    .ip13-ref-expertises ul {
        grid-template-columns:1fr;
    }

    .ip13-ref-final__box {
        display:grid;

        padding:25px 20px;
    }

}


/* ==========================================================
   REFERENCEMENT — HERO V2
   Titre + image rééquilibrés
========================================================== */

.ip13-ref-hero {
    padding:72px 0 76px;
}

.ip13-ref-hero__content {
    grid-template-columns:minmax(0, .92fr)
        minmax(480px, 1.08fr);

    gap:56px;

    align-items:center;
}

.ip13-ref-hero__text {
    min-width:0;
}

.ip13-ref-hero h1 {
    width:100%;
    max-width:660px;

    margin:0;

    font-size:clamp(3rem, 4.6vw, 4.75rem);
    line-height:.98;
    letter-spacing:-.055em;

    overflow-wrap:normal;
    word-break:normal;
}

.ip13-ref-hero h1 span {
    display:block;

    margin-top:7px;

    color:#963cff;
}

.ip13-ref-hero__claim {
    max-width:620px;

    margin:27px 0 0;

    color:#151515;

    font-size:clamp(1.2rem, 1.8vw, 1.55rem);
    font-weight:800;
    line-height:1.35;
    letter-spacing:-.025em;
}

.ip13-ref-hero__lead {
    max-width:650px;

    margin-top:18px;

    font-size:.91rem;
    line-height:1.72;
}

.ip13-ref-hero__sub {
    max-width:650px;

    margin-top:13px;

    font-size:.76rem;
    line-height:1.7;
}


/* ----------------------------------------------------------
   IMAGE HERO
---------------------------------------------------------- */

.ip13-ref-hero__visual {
    position:relative;

    width:100%;
    max-width:690px;

    margin-left:auto;

    overflow:hidden;

    border:1px solid rgba(102, 137, 255, .28);
    border-radius:16px;

    background:#ffffff;

    box-shadow:0 28px 75px rgba(0, 0, 0, .42),
        0 0 55px rgba(126, 34, 206, .13);
}

.ip13-ref-hero__visual::before {
    content:"";

    position:absolute;
    inset:0;

    z-index:2;

    pointer-events:none;

    border-radius:inherit;

    box-shadow:inset 0 0 0 1px rgba(0, 0, 0,.018);
}

.ip13-ref-hero__visual img {
    display:block;

    width:100%;
    height:auto;

    margin:0;

    object-fit:cover;
}


/* ==========================================================
   ETAPES METHODE — NUMEROS ENCADRES
========================================================== */

.ip13-ref-process article {
    min-height:160px;

    padding:20px;

    border:1px solid rgba(0, 0, 0,.075);
    border-radius:12px;

    background:radial-gradient(
            circle at 0 0,
            rgba(102,137,255,.07),
            transparent 42%
        ),
        #ffffff;
}

.ip13-ref-process article > strong {
    display:inline-flex;

    width:43px;
    height:31px;

    align-items:center;
    justify-content:center;

    margin:0 0 17px;

    border:1px solid rgba(102,137,255,.72);
    border-radius:8px;

    background:linear-gradient(
            135deg,
            rgba(102,137,255,.24),
            rgba(76,29,149,.17)
        );

    color:#e2c6ff;

    box-shadow:0 0 18px rgba(102,137,255,.08);

    font-size:.67rem;
    font-weight:950;
    line-height:1;
}

.ip13-ref-process article h3 {
    margin:0 0 8px;

    color:#151515;

    font-size:.93rem;
    font-weight:850;
}

.ip13-ref-process article p {
    margin:0;

    color:#858092;

    font-size:.7rem;
    line-height:1.6;
}


/* ==========================================================
   TABLETTE
========================================================== */

@media (max-width: 1150px) {

    .ip13-ref-hero__content {
        grid-template-columns:minmax(0, 1fr)
            minmax(390px, .9fr);

        gap:38px;
    }

    .ip13-ref-hero h1 {
        font-size:clamp(2.8rem, 5vw, 4.1rem);
    }

}


/* ==========================================================
   TABLETTE / MOBILE
========================================================== */

@media (max-width: 900px) {

    .ip13-ref-hero__content {
        grid-template-columns:1fr;

        gap:38px;
    }

    .ip13-ref-hero__visual {
        max-width:760px;
        margin:0 auto;
    }

    .ip13-ref-hero__text {
        max-width:760px;
    }

    .ip13-ref-hero h1 {
        max-width:700px;
    }

}


@media (max-width: 650px) {

    .ip13-ref-hero {
        padding:48px 0 55px;
    }

    .ip13-ref-hero h1 {
        max-width:100%;

        font-size:clamp(2.55rem, 12vw, 3.8rem);
        line-height:.98;
    }

    .ip13-ref-hero__claim {
        margin-top:22px;

        font-size:1.15rem;
    }

    .ip13-ref-hero__lead {
        font-size:.84rem;
    }

    .ip13-ref-hero__sub {
        font-size:.72rem;
    }

    .ip13-ref-hero__visual {
        border-radius:12px;
    }

    .ip13-ref-process article {
        min-height:0;
    }

}


/* ==========================================================
   IP13 SEO/GEO - CONTRASTE ACCESSIBILITE
========================================================== */

body.page-template-page-referencement-visibilite-digitale
.ip13-seo-audit-card p,
body.page-template-page-referencement-visibilite-digitale
.ip13-seo-card p,
body.page-template-page-referencement-visibilite-digitale
.ip13-seo-feature p {
    color:#e3e6ec !important;
}

body.page-template-page-referencement-visibilite-digitale
.ip13-seo-audit-card strong,
body.page-template-page-referencement-visibilite-digitale
.ip13-seo-card strong,
body.page-template-page-referencement-visibilite-digitale
.ip13-seo-feature strong {
    color:#f3f0f7 !important;
}

body.page-template-page-referencement-visibilite-digitale
.ip13-seo-audit-card span,
body.page-template-page-referencement-visibilite-digitale
.ip13-seo-card span,
body.page-template-page-referencement-visibilite-digitale
.ip13-seo-feature span {
    color:#2f5fff !important;
}



/* ==========================================================
   IP13 REFERENCEMENT - CONTRASTE AUDIT FINAL
   Page ID 23775
========================================================== */

body.page-id-23775 .ip13-ref-audit > div {
    color:#f5f7fb !important;
}

body.page-id-23775 .ip13-ref-audit > div strong {
    color:#a9bfff !important;
}

body.page-id-23775 .ip13-ref-audit > div p {
    color:#e3e6ec !important;
}



/* ==========================================================
   IP13 REFERENCEMENT - CONTRASTE AUDIT DEFINITIF
========================================================== */

.ip13-ref-audit > div {
    color:#151515 !important;
}

.ip13-ref-audit > div strong {
    color:#151515 !important;
}

.ip13-ref-audit > div p {
    color:#e2e2ea !important;
    opacity:1 !important;
}

