{"id":17,"date":"2026-09-18T14:15:50","date_gmt":"2026-09-18T12:15:50","guid":{"rendered":"https:\/\/demo.jouglet-web.fr\/paysagiste\/?page_id=17"},"modified":"2026-09-18T15:30:28","modified_gmt":"2026-09-18T13:30:28","slug":"creation-jardin","status":"publish","type":"page","link":"https:\/\/demo.jouglet-web.fr\/paysagiste\/creation-jardin\/","title":{"rendered":"Cr\u00e9ation de jardin"},"content":{"rendered":"\n<div class=\"wp-block-group alignfull is-layout-flow wp-block-group-is-layout-flow\">\n<div class=\"tjc-page\">\n\n<style>\n\n\/* ============================================================\n   TERRA JARDIN \u2014 CR\u00c9ATION DE JARDIN V2\n============================================================ *\/\n\n.tjc-page{\n    --deep:#10291f;\n    --forest:#18392b;\n    --green:#54745d;\n    --sage:#90a98d;\n    --gold:#d5b985;\n    --gold-light:#ead7ad;\n    --cream:#f7f4ed;\n    --white:#ffffff;\n    --black:#161a17;\n    --text:#6f776f;\n    --border:rgba(24,57,43,.12);\n\n    width:100vw;\n    max-width:none;\n\n    margin-left:calc(50% - 50vw);\n    margin-right:calc(50% - 50vw);\n\n    overflow:hidden;\n\n    background:var(--cream);\n    color:var(--black);\n\n    font-family:inherit;\n    -webkit-font-smoothing:antialiased;\n}\n\n.tjc-page *,\n.tjc-page *::before,\n.tjc-page *::after{\n    box-sizing:border-box;\n}\n\n.tjc-page img{\n    display:block;\n    width:100%;\n    max-width:100%;\n}\n\n.tjc-page a{\n    color:inherit;\n    text-decoration:none;\n}\n\n.tjc-container{\n    width:min(1240px,calc(100% - 48px));\n    margin-inline:auto;\n}\n\n.tjc-section{\n    position:relative;\n    padding:115px 0;\n}\n\n\n\/* ============================================================\n   TYPO\n============================================================ *\/\n\n.tjc-kicker{\n    display:inline-flex;\n    align-items:center;\n    gap:12px;\n\n    margin:0 0 18px;\n\n    color:var(--green);\n\n    font-size:11px;\n    line-height:1;\n    font-weight:850;\n    letter-spacing:.15em;\n    text-transform:uppercase;\n}\n\n.tjc-kicker::before{\n    content:\"\";\n\n    width:34px;\n    height:1px;\n\n    background:var(--gold);\n}\n\n.tjc-title{\n    margin:0;\n\n    color:var(--deep);\n\n    font-size:clamp(42px,5.1vw,70px);\n    line-height:.98;\n    font-weight:780;\n    letter-spacing:-.05em;\n}\n\n.tjc-title span{\n    color:var(--gold);\n}\n\n.tjc-text{\n    max-width:660px;\n\n    margin:22px 0 0;\n\n    color:var(--text);\n\n    font-size:16px;\n    line-height:1.75;\n}\n\n.tjc-heading{\n    max-width:790px;\n    margin-bottom:54px;\n}\n\n.tjc-heading-center{\n    margin-left:auto;\n    margin-right:auto;\n\n    text-align:center;\n}\n\n.tjc-heading-center .tjc-kicker{\n    justify-content:center;\n}\n\n.tjc-heading-center .tjc-text{\n    margin-left:auto;\n    margin-right:auto;\n}\n\n\n\/* ============================================================\n   BUTTONS\n============================================================ *\/\n\n.tjc-btn{\n    min-height:56px;\n\n    padding:0 25px;\n\n    display:inline-flex;\n    align-items:center;\n    justify-content:center;\n    gap:10px;\n\n    border:1px solid transparent;\n    border-radius:999px;\n\n    font-size:13px;\n    font-weight:800;\n\n    transition:\n        transform .3s ease,\n        background .3s ease,\n        color .3s ease,\n        border-color .3s ease,\n        box-shadow .3s ease;\n}\n\n.tjc-btn:hover{\n    transform:translateY(-3px);\n}\n\n.tjc-btn-gold{\n    background:var(--gold);\n    color:var(--deep);\n\n    box-shadow:\n        0 14px 35px rgba(213,185,133,.2);\n}\n\n.tjc-btn-gold:hover{\n    background:var(--gold-light);\n}\n\n.tjc-btn-light{\n    border-color:rgba(255,255,255,.24);\n\n    background:rgba(255,255,255,.07);\n\n    color:#fff;\n\n    backdrop-filter:blur(12px);\n}\n\n.tjc-btn-light:hover{\n    background:#fff;\n    color:var(--deep);\n}\n\n.tjc-btn-dark{\n    border-color:rgba(16,41,31,.18);\n\n    background:transparent;\n\n    color:var(--deep);\n}\n\n.tjc-btn-dark:hover{\n    background:var(--deep);\n    color:#fff;\n}\n\n.tjc-arrow{\n    transition:transform .3s ease;\n}\n\n.tjc-btn:hover .tjc-arrow{\n    transform:translateX(5px);\n}\n\n\n\/* ============================================================\n   HERO\n============================================================ *\/\n\n.tjc-hero{\n    position:relative;\n\n    min-height:800px;\n\n    display:flex;\n    align-items:center;\n\n    overflow:hidden;\n\n    background:var(--deep);\n    color:#fff;\n\n    isolation:isolate;\n}\n\n.tjc-hero-bg{\n    position:absolute;\n    inset:0;\n    z-index:-4;\n}\n\n.tjc-hero-bg img{\n    width:100%;\n    height:100%;\n\n    object-fit:cover;\n}\n\n.tjc-hero-overlay{\n    position:absolute;\n    inset:0;\n    z-index:-3;\n\n    background:\n        linear-gradient(\n            90deg,\n            rgba(6,22,15,.96) 0%,\n            rgba(6,22,15,.84) 43%,\n            rgba(6,22,15,.48) 73%,\n            rgba(6,22,15,.27) 100%\n        ),\n        linear-gradient(\n            0deg,\n            rgba(6,22,15,.50),\n            transparent 55%\n        );\n}\n\n.tjc-hero::after{\n    content:\"\";\n\n    position:absolute;\n    z-index:-2;\n\n    width:650px;\n    height:650px;\n\n    left:-350px;\n    bottom:-370px;\n\n    border-radius:50%;\n\n    background:rgba(213,185,133,.13);\n\n    filter:blur(80px);\n}\n\n.tjc-hero-inner{\n    width:min(1240px,calc(100% - 48px));\n    margin:auto;\n\n    padding:115px 0 85px;\n\n    display:grid;\n    grid-template-columns:1.15fr .65fr;\n    gap:70px;\n\n    align-items:center;\n}\n\n.tjc-hero-content{\n    max-width:800px;\n}\n\n.tjc-hero-badge{\n    display:inline-flex;\n    align-items:center;\n    gap:10px;\n\n    margin-bottom:24px;\n    padding:9px 14px;\n\n    border:1px solid rgba(255,255,255,.18);\n    border-radius:999px;\n\n    background:rgba(255,255,255,.07);\n\n    backdrop-filter:blur(12px);\n\n    color:rgba(255,255,255,.9);\n\n    font-size:10px;\n    font-weight:850;\n    letter-spacing:.14em;\n    text-transform:uppercase;\n}\n\n.tjc-hero-badge-dot{\n    width:7px;\n    height:7px;\n\n    border-radius:50%;\n\n    background:var(--gold);\n\n    box-shadow:\n        0 0 0 5px rgba(213,185,133,.12);\n}\n\n.tjc-hero h1{\n    margin:0;\n\n    color:#fff;\n\n    font-size:clamp(52px,6vw,88px);\n    line-height:.92;\n    font-weight:780;\n    letter-spacing:-.057em;\n}\n\n.tjc-hero h1 span{\n    display:block;\n\n    color:var(--gold);\n}\n\n.tjc-hero-desc{\n    max-width:640px;\n\n    margin:28px 0 0;\n\n    color:rgba(255,255,255,.74);\n\n    font-size:18px;\n    line-height:1.65;\n}\n\n.tjc-hero-points{\n    display:flex;\n    flex-wrap:wrap;\n    gap:12px 22px;\n\n    margin-top:28px;\n}\n\n.tjc-hero-point{\n    display:flex;\n    align-items:center;\n    gap:9px;\n\n    color:rgba(255,255,255,.9);\n\n    font-size:12px;\n    font-weight:700;\n}\n\n.tjc-check{\n    width:20px;\n    height:20px;\n\n    display:grid;\n    place-items:center;\n\n    flex:0 0 auto;\n\n    border-radius:50%;\n\n    background:var(--gold);\n    color:var(--deep);\n\n    font-size:10px;\n    font-weight:900;\n}\n\n.tjc-hero-actions{\n    display:flex;\n    flex-wrap:wrap;\n    gap:12px;\n\n    margin-top:34px;\n}\n\n\n\/* HERO VISUEL *\/\n\n.tjc-hero-side{\n    position:relative;\n\n    min-height:500px;\n}\n\n.tjc-hero-side-main{\n    position:absolute;\n\n    inset:30px 10px 40px 45px;\n\n    overflow:hidden;\n\n    border:1px solid rgba(255,255,255,.15);\n    border-radius:30px;\n\n    background:#315b45;\n\n    box-shadow:\n        0 35px 90px rgba(0,0,0,.34);\n}\n\n.tjc-hero-side-main img{\n    width:100%;\n    height:100%;\n\n    object-fit:cover;\n}\n\n.tjc-hero-side-main::after{\n    content:\"\";\n\n    position:absolute;\n    inset:0;\n\n    background:\n        linear-gradient(\n            0deg,\n            rgba(6,22,15,.52),\n            transparent 55%\n        );\n}\n\n.tjc-floating{\n    position:absolute;\n    z-index:3;\n\n    min-width:180px;\n\n    padding:16px 17px;\n\n    border:1px solid rgba(255,255,255,.17);\n    border-radius:18px;\n\n    background:rgba(7,26,18,.84);\n\n    backdrop-filter:blur(15px);\n\n    box-shadow:\n        0 20px 45px rgba(0,0,0,.2);\n}\n\n.tjc-floating strong{\n    display:block;\n\n    color:#fff;\n\n    font-size:13px;\n}\n\n.tjc-floating small{\n    display:block;\n\n    margin-top:4px;\n\n    color:rgba(255,255,255,.60);\n\n    font-size:9px;\n}\n\n.tjc-floating-top{\n    top:0;\n    right:0;\n}\n\n.tjc-floating-bottom{\n    left:0;\n    bottom:5px;\n}\n\n\n\/* ============================================================\n   BENEFITS\n============================================================ *\/\n\n.tjc-benefits{\n    position:relative;\n\n    padding:70px 0;\n\n    overflow:hidden;\n\n    background:var(--deep);\n}\n\n.tjc-benefits::before{\n    content:\"\";\n\n    position:absolute;\n    inset:0;\n\n    opacity:.07;\n\n    background-image:\n        radial-gradient(\n            circle at 1px 1px,\n            #fff 1px,\n            transparent 0\n        );\n\n    background-size:24px 24px;\n}\n\n.tjc-benefits-grid{\n    position:relative;\n\n    display:grid;\n    grid-template-columns:repeat(4,1fr);\n}\n\n.tjc-benefit{\n    padding:15px 30px;\n\n    text-align:center;\n\n    border-right:1px solid rgba(255,255,255,.12);\n}\n\n.tjc-benefit:last-child{\n    border-right:0;\n}\n\n.tjc-benefit-icon{\n    width:45px;\n    height:45px;\n\n    margin:0 auto 16px;\n\n    display:grid;\n    place-items:center;\n\n    border-radius:14px;\n\n    background:rgba(213,185,133,.16);\n    color:var(--gold);\n}\n\n.tjc-benefit-icon svg{\n    width:21px;\n    height:21px;\n}\n\n.tjc-benefit strong{\n    display:block;\n\n    color:#fff;\n\n    font-size:14px;\n}\n\n.tjc-benefit span{\n    display:block;\n\n    margin-top:6px;\n\n    color:rgba(255,255,255,.58);\n\n    font-size:10px;\n    line-height:1.5;\n}\n\n\n\/* ============================================================\n   INTRO\n============================================================ *\/\n\n.tjc-intro{\n    background:#fff;\n}\n\n.tjc-intro-grid{\n    display:grid;\n    grid-template-columns:.9fr 1.1fr;\n    gap:80px;\n\n    align-items:center;\n}\n\n.tjc-intro-image-wrap{\n    position:relative;\n}\n\n.tjc-intro-image{\n    overflow:hidden;\n\n    aspect-ratio:4\/5;\n\n    border-radius:30px;\n\n    background:#dce4dc;\n\n    box-shadow:\n        0 25px 65px rgba(16,41,31,.11);\n}\n\n.tjc-intro-image img{\n    width:100%;\n    height:100%;\n\n    object-fit:cover;\n}\n\n.tjc-intro-badge{\n    position:absolute;\n\n    right:-28px;\n    bottom:40px;\n\n    width:195px;\n\n    padding:20px;\n\n    border-radius:18px;\n\n    background:var(--gold);\n    color:var(--deep);\n\n    box-shadow:\n        0 18px 45px rgba(16,41,31,.17);\n}\n\n.tjc-intro-badge small{\n    display:block;\n\n    font-size:9px;\n    font-weight:850;\n    letter-spacing:.12em;\n    text-transform:uppercase;\n}\n\n.tjc-intro-badge strong{\n    display:block;\n\n    margin-top:7px;\n\n    font-size:19px;\n    line-height:1.15;\n}\n\n.tjc-intro-cards{\n    display:grid;\n    grid-template-columns:1fr 1fr;\n    gap:13px;\n\n    margin-top:35px;\n}\n\n.tjc-intro-card{\n    padding:22px;\n\n    border:1px solid var(--border);\n    border-radius:19px;\n\n    background:var(--cream);\n}\n\n.tjc-intro-card span{\n    display:block;\n\n    margin-bottom:14px;\n\n    color:var(--gold);\n\n    font-size:10px;\n    font-weight:900;\n}\n\n.tjc-intro-card strong{\n    display:block;\n\n    color:var(--deep);\n\n    font-size:16px;\n}\n\n.tjc-intro-card p{\n    margin:7px 0 0;\n\n    color:var(--text);\n\n    font-size:11px;\n    line-height:1.6;\n}\n\n\n\/* ============================================================\n   NOUVELLE SECTION \u2014 CR\u00c9ATION COMPL\u00c8TE\n============================================================ *\/\n\n.tjc-included{\n    position:relative;\n\n    overflow:hidden;\n\n    background:var(--cream);\n}\n\n.tjc-included::before{\n    content:\"\";\n\n    position:absolute;\n\n    width:650px;\n    height:650px;\n\n    right:-390px;\n    top:-380px;\n\n    border-radius:50%;\n\n    background:\n        radial-gradient(\n            circle,\n            rgba(213,185,133,.14),\n            transparent 68%\n        );\n}\n\n.tjc-included::after{\n    content:\"\";\n\n    position:absolute;\n\n    width:430px;\n    height:430px;\n\n    left:-300px;\n    bottom:-270px;\n\n    border-radius:50%;\n\n    border:1px solid rgba(24,57,43,.06);\n}\n\n.tjc-included-head{\n    position:relative;\n    z-index:2;\n\n    max-width:850px;\n\n    margin:0 auto 55px;\n\n    text-align:center;\n}\n\n.tjc-included-head .tjc-kicker{\n    justify-content:center;\n}\n\n.tjc-included-head .tjc-text{\n    max-width:660px;\n\n    margin-left:auto;\n    margin-right:auto;\n}\n\n\n\/* GRID *\/\n\n.tjc-included-grid{\n    position:relative;\n    z-index:2;\n\n    display:grid;\n    grid-template-columns:repeat(3,1fr);\n    gap:17px;\n}\n\n\n\/* CARD *\/\n\n.tjc-included-card{\n    position:relative;\n\n    min-height:285px;\n\n    overflow:hidden;\n\n    padding:28px;\n\n    border:1px solid rgba(24,57,43,.11);\n    border-radius:24px;\n\n    background:\n        linear-gradient(\n            145deg,\n            rgba(255,255,255,.98),\n            rgba(255,255,255,.88)\n        );\n\n    box-shadow:\n        0 8px 30px rgba(16,41,31,.035);\n\n    transition:\n        transform .45s cubic-bezier(.2,.7,.2,1),\n        border-color .4s ease,\n        box-shadow .45s ease,\n        background .45s ease;\n}\n\n.tjc-included-card::before{\n    content:\"\";\n\n    position:absolute;\n\n    left:0;\n    right:0;\n    top:0;\n\n    height:3px;\n\n    background:\n        linear-gradient(\n            90deg,\n            var(--gold),\n            var(--green)\n        );\n\n    transform:scaleX(0);\n\n    transform-origin:left;\n\n    transition:\n        transform .45s ease;\n}\n\n.tjc-included-card::after{\n    content:\"\";\n\n    position:absolute;\n\n    width:180px;\n    height:180px;\n\n    right:-95px;\n    bottom:-100px;\n\n    border-radius:50%;\n\n    background:\n        radial-gradient(\n            circle,\n            rgba(213,185,133,.13),\n            transparent 70%\n        );\n\n    pointer-events:none;\n\n    transition:\n        transform .5s ease;\n}\n\n.tjc-included-card:hover{\n    transform:translateY(-8px);\n\n    border-color:rgba(213,185,133,.65);\n\n    background:#fff;\n\n    box-shadow:\n        0 28px 65px rgba(16,41,31,.09);\n}\n\n.tjc-included-card:hover::before{\n    transform:scaleX(1);\n}\n\n.tjc-included-card:hover::after{\n    transform:scale(1.2);\n}\n\n\n\/* TOP *\/\n\n.tjc-included-top{\n    display:flex;\n    align-items:center;\n    justify-content:space-between;\n\n    margin-bottom:30px;\n}\n\n.tjc-included-icon{\n    width:54px;\n    height:54px;\n\n    display:grid;\n    place-items:center;\n\n    border-radius:16px;\n\n    background:\n        linear-gradient(\n            145deg,\n            #f1e7d2,\n            #f8f2e7\n        );\n\n    color:var(--deep);\n\n    box-shadow:\n        inset 0 0 0 1px rgba(213,185,133,.18);\n\n    transition:\n        transform .35s ease,\n        background .35s ease;\n}\n\n.tjc-included-card:hover .tjc-included-icon{\n    transform:\n        translateY(-3px)\n        rotate(-2deg);\n\n    background:var(--gold);\n}\n\n.tjc-included-icon svg{\n    width:23px;\n    height:23px;\n}\n\n.tjc-included-number{\n    min-width:38px;\n    height:38px;\n\n    display:grid;\n    place-items:center;\n\n    border:1px solid rgba(24,57,43,.08);\n    border-radius:50%;\n\n    background:var(--cream);\n\n    color:rgba(16,41,31,.40);\n\n    font-size:9px;\n    font-weight:900;\n\n    transition:\n        background .35s ease,\n        color .35s ease;\n}\n\n.tjc-included-card:hover .tjc-included-number{\n    background:var(--deep);\n    color:var(--gold);\n}\n\n\n\/* CONTENT *\/\n\n.tjc-included-card h3{\n    margin:0 0 11px;\n\n    color:var(--deep);\n\n    font-size:21px;\n    line-height:1.15;\n    letter-spacing:-.02em;\n}\n\n.tjc-included-card p{\n    max-width:330px;\n\n    margin:0;\n\n    color:var(--text);\n\n    font-size:12px;\n    line-height:1.7;\n}\n\n.tjc-included-meta{\n    margin-top:23px;\n\n    display:flex;\n    align-items:center;\n    gap:7px;\n\n    color:var(--green);\n\n    font-size:9px;\n    font-weight:850;\n    letter-spacing:.06em;\n    text-transform:uppercase;\n}\n\n.tjc-included-meta::before{\n    content:\"\";\n\n    width:18px;\n    height:1px;\n\n    background:var(--gold);\n}\n\n\n\/* ============================================================\n   TYPES JARDINS\n============================================================ *\/\n\n.tjc-types{\n    background:#fff;\n}\n\n.tjc-types-grid{\n    display:grid;\n    grid-template-columns:repeat(3,1fr);\n    gap:16px;\n}\n\n.tjc-type{\n    position:relative;\n\n    min-height:430px;\n\n    overflow:hidden;\n\n    border-radius:24px;\n\n    background:var(--deep);\n\n    isolation:isolate;\n}\n\n.tjc-type-media{\n    position:absolute;\n    inset:0;\n    z-index:-2;\n}\n\n.tjc-type-media img{\n    width:100%;\n    height:100%;\n\n    object-fit:cover;\n\n    transition:\n        transform .75s cubic-bezier(.2,.7,.2,1);\n}\n\n.tjc-type:hover img{\n    transform:scale(1.055);\n}\n\n.tjc-type::after{\n    content:\"\";\n\n    position:absolute;\n    inset:0;\n    z-index:-1;\n\n    background:\n        linear-gradient(\n            0deg,\n            rgba(6,22,15,.94) 0%,\n            rgba(6,22,15,.54) 45%,\n            rgba(6,22,15,.09) 80%\n        );\n}\n\n.tjc-type-content{\n    position:absolute;\n\n    left:25px;\n    right:25px;\n    bottom:24px;\n}\n\n.tjc-type-content span{\n    display:block;\n\n    margin-bottom:7px;\n\n    color:var(--gold);\n\n    font-size:9px;\n    font-weight:850;\n    letter-spacing:.11em;\n    text-transform:uppercase;\n}\n\n.tjc-type-content h3{\n    margin:0 0 10px;\n\n    color:#fff;\n\n    font-size:24px;\n}\n\n.tjc-type-content p{\n    margin:0;\n\n    color:rgba(255,255,255,.68);\n\n    font-size:11px;\n    line-height:1.6;\n}\n\n\n\/* ============================================================\n   TRANSFORMATION\n============================================================ *\/\n\n.tjc-transform{\n    background:var(--cream);\n}\n\n.tjc-transform-box{\n    position:relative;\n\n    min-height:620px;\n\n    overflow:hidden;\n\n    border-radius:32px;\n\n    background:var(--deep);\n}\n\n.tjc-transform-box > img{\n    position:absolute;\n    inset:0;\n\n    width:100%;\n    height:100%;\n\n    object-fit:cover;\n}\n\n.tjc-transform-box::after{\n    content:\"\";\n\n    position:absolute;\n    inset:0;\n\n    background:\n        linear-gradient(\n            90deg,\n            rgba(6,22,15,.91),\n            rgba(6,22,15,.45) 63%,\n            rgba(6,22,15,.14)\n        );\n}\n\n.tjc-transform-content{\n    position:relative;\n    z-index:2;\n\n    max-width:660px;\n    min-height:620px;\n\n    padding:70px;\n\n    display:flex;\n    flex-direction:column;\n    justify-content:center;\n\n    color:#fff;\n}\n\n.tjc-transform-tag{\n    width:max-content;\n\n    margin-bottom:22px;\n    padding:8px 12px;\n\n    border:1px solid rgba(255,255,255,.2);\n    border-radius:999px;\n\n    background:rgba(255,255,255,.08);\n\n    font-size:9px;\n    font-weight:850;\n    letter-spacing:.12em;\n    text-transform:uppercase;\n}\n\n.tjc-transform h2{\n    margin:0;\n\n    color:#fff;\n\n    font-size:clamp(44px,6vw,75px);\n    line-height:.95;\n    letter-spacing:-.05em;\n}\n\n.tjc-transform h2 span{\n    color:var(--gold);\n}\n\n.tjc-transform p{\n    max-width:520px;\n\n    margin:24px 0 0;\n\n    color:rgba(255,255,255,.70);\n\n    font-size:14px;\n    line-height:1.7;\n}\n\n.tjc-transform-chips{\n    display:flex;\n    flex-wrap:wrap;\n    gap:8px;\n\n    margin-top:28px;\n}\n\n.tjc-transform-chips span{\n    padding:8px 11px;\n\n    border:1px solid rgba(255,255,255,.11);\n    border-radius:10px;\n\n    background:rgba(255,255,255,.08);\n\n    font-size:10px;\n}\n\n\n\/* ============================================================\n   TIMELINE\n============================================================ *\/\n\n.tjc-process{\n    position:relative;\n\n    background:#fff;\n\n    --tjc-progress:0;\n}\n\n.tjc-process-wrap{\n    position:relative;\n\n    margin-top:75px;\n}\n\n.tjc-process-line{\n    position:absolute;\n\n    top:39px;\n    left:10%;\n    right:10%;\n\n    height:3px;\n\n    overflow:hidden;\n\n    border-radius:100px;\n\n    background:#e0e5e1;\n}\n\n.tjc-process-progress{\n    position:absolute;\n    inset:0;\n\n    background:\n        linear-gradient(\n            90deg,\n            var(--gold),\n            var(--forest)\n        );\n\n    transform:\n        scaleX(var(--tjc-progress));\n\n    transform-origin:left center;\n}\n\n.tjc-process-grid{\n    position:relative;\n\n    display:grid;\n    grid-template-columns:repeat(5,1fr);\n    gap:20px;\n}\n\n.tjc-process-step{\n    position:relative;\n    text-align:center;\n}\n\n.tjc-process-number{\n    position:relative;\n    z-index:2;\n\n    width:80px;\n    height:80px;\n\n    margin:0 auto 25px;\n\n    display:grid;\n    place-items:center;\n\n    border:9px solid #fff;\n    border-radius:50%;\n\n    background:#e4e8e4;\n    color:#839087;\n\n    font-size:11px;\n    font-weight:900;\n\n    transition:\n        transform .4s ease,\n        background .4s ease,\n        color .4s ease;\n}\n\n.tjc-process-step.tjc-active\n.tjc-process-number{\n    transform:scale(1.08);\n\n    background:var(--deep);\n    color:var(--gold);\n}\n\n.tjc-process-step h3{\n    margin:0 0 9px;\n\n    color:var(--deep);\n\n    font-size:17px;\n}\n\n.tjc-process-step p{\n    max-width:200px;\n\n    margin:0 auto;\n\n    color:var(--text);\n\n    font-size:11px;\n    line-height:1.65;\n}\n\n\n\/* ============================================================\n   GALLERY\n============================================================ *\/\n\n.tjc-gallery{\n    background:var(--cream);\n}\n\n.tjc-gallery-grid{\n    display:grid;\n\n    grid-template-columns:1.2fr .8fr .8fr;\n    grid-template-rows:270px 270px;\n\n    gap:15px;\n}\n\n.tjc-gallery-item{\n    position:relative;\n\n    overflow:hidden;\n\n    border-radius:22px;\n\n    background:#dce4dc;\n}\n\n.tjc-gallery-item:first-child{\n    grid-row:span 2;\n}\n\n.tjc-gallery-item img{\n    width:100%;\n    height:100%;\n\n    object-fit:cover;\n\n    transition:\n        transform .75s cubic-bezier(.2,.7,.2,1);\n}\n\n.tjc-gallery-item:hover img{\n    transform:scale(1.06);\n}\n\n.tjc-gallery-item::after{\n    content:\"\";\n\n    position:absolute;\n    inset:0;\n\n    background:\n        linear-gradient(\n            0deg,\n            rgba(6,22,15,.78),\n            transparent 58%\n        );\n}\n\n.tjc-gallery-info{\n    position:absolute;\n    z-index:2;\n\n    left:20px;\n    right:20px;\n    bottom:18px;\n}\n\n.tjc-gallery-info span{\n    display:block;\n\n    margin-bottom:4px;\n\n    color:var(--gold);\n\n    font-size:8px;\n    font-weight:850;\n    letter-spacing:.1em;\n    text-transform:uppercase;\n}\n\n.tjc-gallery-info strong{\n    color:#fff;\n\n    font-size:16px;\n}\n\n.tjc-gallery-action{\n    margin-top:30px;\n\n    text-align:center;\n}\n\n\n\/* ============================================================\n   RELATED\n============================================================ *\/\n\n.tjc-related{\n    background:#fff;\n}\n\n.tjc-related-grid{\n    display:grid;\n    grid-template-columns:repeat(3,1fr);\n    gap:16px;\n}\n\n.tjc-related-card{\n    position:relative;\n\n    min-height:330px;\n\n    overflow:hidden;\n\n    border-radius:23px;\n\n    background:var(--deep);\n\n    isolation:isolate;\n}\n\n.tjc-related-card img{\n    position:absolute;\n    inset:0;\n    z-index:-2;\n\n    width:100%;\n    height:100%;\n\n    object-fit:cover;\n\n    transition:\n        transform .7s cubic-bezier(.2,.7,.2,1);\n}\n\n.tjc-related-card:hover img{\n    transform:scale(1.055);\n}\n\n.tjc-related-card::after{\n    content:\"\";\n\n    position:absolute;\n    inset:0;\n    z-index:-1;\n\n    background:\n        linear-gradient(\n            0deg,\n            rgba(6,22,15,.94),\n            rgba(6,22,15,.15)\n        );\n}\n\n.tjc-related-content{\n    position:absolute;\n\n    left:24px;\n    right:24px;\n    bottom:22px;\n}\n\n.tjc-related-content span{\n    display:block;\n\n    margin-bottom:6px;\n\n    color:var(--gold);\n\n    font-size:8px;\n    font-weight:850;\n    letter-spacing:.1em;\n    text-transform:uppercase;\n}\n\n.tjc-related-content strong{\n    display:block;\n\n    color:#fff;\n\n    font-size:21px;\n}\n\n.tjc-related-content small{\n    display:block;\n\n    margin-top:7px;\n\n    color:rgba(255,255,255,.63);\n\n    font-size:10px;\n}\n\n\n\/* ============================================================\n   FAQ\n============================================================ *\/\n\n.tjc-faq{\n    background:var(--cream);\n}\n\n.tjc-faq-grid{\n    display:grid;\n    grid-template-columns:.72fr 1.28fr;\n    gap:70px;\n\n    align-items:start;\n}\n\n.tjc-faq-intro{\n    position:sticky;\n    top:120px;\n}\n\n.tjc-faq-list{\n    display:grid;\n    gap:10px;\n}\n\n.tjc-faq-item{\n    overflow:hidden;\n\n    border:1px solid var(--border);\n    border-radius:18px;\n\n    background:#fff;\n}\n\n.tjc-faq-item summary{\n    position:relative;\n\n    padding:21px 58px 21px 22px;\n\n    cursor:pointer;\n    list-style:none;\n\n    color:var(--deep);\n\n    font-size:14px;\n    font-weight:800;\n}\n\n.tjc-faq-item summary::-webkit-details-marker{\n    display:none;\n}\n\n.tjc-faq-item summary::after{\n    content:\"+\";\n\n    position:absolute;\n\n    right:20px;\n    top:50%;\n\n    width:28px;\n    height:28px;\n\n    display:grid;\n    place-items:center;\n\n    transform:translateY(-50%);\n\n    border-radius:50%;\n\n    background:rgba(213,185,133,.22);\n\n    font-size:17px;\n}\n\n.tjc-faq-item[open] summary::after{\n    content:\"\u2212\";\n}\n\n.tjc-faq-answer{\n    padding:0 22px 21px;\n\n    color:var(--text);\n\n    font-size:12px;\n    line-height:1.7;\n}\n\n\n\/* ============================================================\n   FINAL\n============================================================ *\/\n\n.tjc-final{\n    padding:105px 0;\n\n    background:#fff;\n}\n\n.tjc-final-box{\n    position:relative;\n\n    overflow:hidden;\n\n    padding:88px 60px;\n\n    border-radius:32px;\n\n    background:var(--deep);\n    color:#fff;\n\n    text-align:center;\n}\n\n.tjc-final-content{\n    position:relative;\n    z-index:2;\n\n    max-width:840px;\n\n    margin:auto;\n}\n\n.tjc-final .tjc-kicker{\n    color:var(--gold);\n}\n\n.tjc-final h2{\n    margin:0;\n\n    color:#fff;\n\n    font-size:clamp(46px,6vw,79px);\n    line-height:.95;\n    letter-spacing:-.052em;\n}\n\n.tjc-final h2 span{\n    color:var(--gold);\n}\n\n.tjc-final p{\n    max-width:670px;\n\n    margin:24px auto 0;\n\n    color:rgba(255,255,255,.70);\n\n    font-size:15px;\n    line-height:1.75;\n}\n\n.tjc-final-actions{\n    display:flex;\n    flex-wrap:wrap;\n    justify-content:center;\n    gap:12px;\n\n    margin-top:32px;\n}\n\n.tjc-final-points{\n    display:flex;\n    flex-wrap:wrap;\n    justify-content:center;\n    gap:13px 24px;\n\n    margin-top:34px;\n}\n\n.tjc-final-point{\n    display:flex;\n    align-items:center;\n    gap:8px;\n\n    color:rgba(255,255,255,.70);\n\n    font-size:10px;\n}\n\n\n\/* ============================================================\n   SAFE SCROLL\n============================================================ *\/\n\n.tjc-reveal{\n    opacity:1;\n    transform:none;\n}\n\n.tjc-page.tjc-motion-ready\n.tjc-reveal:not(.tjc-visible){\n    opacity:0;\n    transform:translateY(42px);\n}\n\n.tjc-page.tjc-motion-ready\n.tjc-reveal.tjc-visible{\n    opacity:1;\n    transform:translateY(0);\n\n    transition:\n        opacity .75s cubic-bezier(.2,.7,.2,1),\n        transform .75s cubic-bezier(.2,.7,.2,1);\n}\n\n\n\/* Included stagger *\/\n\n.tjc-page.tjc-motion-ready\n.tjc-included-card:nth-child(2){\n    transition-delay:.07s;\n}\n\n.tjc-page.tjc-motion-ready\n.tjc-included-card:nth-child(3){\n    transition-delay:.14s;\n}\n\n.tjc-page.tjc-motion-ready\n.tjc-included-card:nth-child(5){\n    transition-delay:.07s;\n}\n\n.tjc-page.tjc-motion-ready\n.tjc-included-card:nth-child(6){\n    transition-delay:.14s;\n}\n\n\n\/* ============================================================\n   TABLET\n============================================================ *\/\n\n@media(max-width:1050px){\n\n    .tjc-hero-inner{\n        grid-template-columns:1fr;\n    }\n\n    .tjc-hero-side{\n        display:none;\n    }\n\n    .tjc-intro-grid,\n    .tjc-faq-grid{\n        grid-template-columns:1fr;\n    }\n\n    .tjc-intro-image{\n        aspect-ratio:16\/10;\n    }\n\n    .tjc-faq-intro{\n        position:static;\n    }\n\n    .tjc-included-grid,\n    .tjc-types-grid,\n    .tjc-related-grid{\n        grid-template-columns:repeat(2,1fr);\n    }\n\n}\n\n\n\/* ============================================================\n   MOBILE\n============================================================ *\/\n\n@media(max-width:700px){\n\n    .tjc-container{\n        width:calc(100% - 28px);\n    }\n\n    .tjc-section{\n        padding:70px 0;\n    }\n\n    .tjc-kicker{\n        margin-bottom:13px;\n\n        font-size:8px;\n    }\n\n    .tjc-title{\n        font-size:37px;\n        line-height:1;\n    }\n\n    .tjc-text{\n        margin-top:16px;\n\n        font-size:13px;\n    }\n\n\n    \/* HERO *\/\n\n    .tjc-hero{\n        min-height:700px;\n\n        align-items:flex-end;\n    }\n\n    .tjc-hero-inner{\n        width:calc(100% - 28px);\n\n        padding:135px 0 45px;\n\n        display:block;\n    }\n\n    .tjc-hero h1{\n        font-size:clamp(40px,11.7vw,53px);\n    }\n\n    .tjc-hero-desc{\n        font-size:14px;\n    }\n\n    .tjc-hero-points{\n        display:grid;\n        gap:8px;\n    }\n\n    .tjc-hero-actions{\n        display:grid;\n        grid-template-columns:1fr;\n    }\n\n    .tjc-btn{\n        width:100%;\n        min-height:50px;\n    }\n\n\n    \/* BENEFITS *\/\n\n    .tjc-benefits{\n        padding:48px 0;\n    }\n\n    .tjc-benefits-grid{\n        grid-template-columns:1fr 1fr;\n        gap:26px 0;\n    }\n\n    .tjc-benefit{\n        padding:8px;\n    }\n\n    .tjc-benefit:nth-child(2){\n        border-right:0;\n    }\n\n\n    \/* INTRO *\/\n\n    .tjc-intro-grid{\n        gap:40px;\n    }\n\n    .tjc-intro-image{\n        aspect-ratio:4\/5;\n\n        border-radius:21px;\n    }\n\n    .tjc-intro-badge{\n        right:10px;\n        bottom:10px;\n\n        width:155px;\n\n        padding:15px;\n    }\n\n    .tjc-intro-cards{\n        grid-template-columns:1fr;\n\n        gap:9px;\n    }\n\n\n    \/* NOUVELLE SECTION *\/\n\n    .tjc-included-head{\n        margin-bottom:32px;\n    }\n\n    .tjc-included-grid{\n        grid-template-columns:1fr;\n        gap:11px;\n    }\n\n    .tjc-included-card{\n        min-height:auto;\n\n        padding:20px;\n\n        border-radius:19px;\n    }\n\n    .tjc-included-top{\n        margin-bottom:18px;\n    }\n\n    .tjc-included-icon{\n        width:47px;\n        height:47px;\n\n        border-radius:14px;\n    }\n\n    .tjc-included-icon svg{\n        width:20px;\n        height:20px;\n    }\n\n    .tjc-included-number{\n        width:34px;\n        min-width:34px;\n        height:34px;\n    }\n\n    .tjc-included-card h3{\n        font-size:18px;\n    }\n\n    .tjc-included-card p{\n        font-size:11px;\n    }\n\n    .tjc-included-meta{\n        margin-top:17px;\n\n        font-size:8px;\n    }\n\n\n    \/* TYPES *\/\n\n    .tjc-types-grid{\n        grid-template-columns:1fr;\n    }\n\n    .tjc-type{\n        min-height:370px;\n    }\n\n\n    \/* TRANSFORM *\/\n\n    .tjc-transform-box{\n        min-height:540px;\n    }\n\n    .tjc-transform-content{\n        min-height:540px;\n\n        padding:30px 22px;\n\n        justify-content:flex-end;\n    }\n\n    .tjc-transform h2{\n        font-size:40px;\n    }\n\n\n    \/* TIMELINE *\/\n\n    .tjc-process-line{\n        top:39px;\n        bottom:40px;\n\n        left:39px;\n        right:auto;\n\n        width:3px;\n        height:auto;\n    }\n\n    .tjc-process-progress{\n        transform:\n            scaleY(var(--tjc-progress));\n\n        transform-origin:center top;\n    }\n\n    .tjc-process-grid{\n        grid-template-columns:1fr;\n        gap:0;\n    }\n\n    .tjc-process-step{\n        min-height:160px;\n\n        padding:\n            0\n            0\n            32px\n            98px;\n\n        text-align:left;\n    }\n\n    .tjc-process-number{\n        position:absolute;\n\n        left:0;\n        top:0;\n\n        width:78px;\n        height:78px;\n\n        margin:0;\n    }\n\n\n    \/* RELATED *\/\n\n    .tjc-related-grid{\n        grid-template-columns:1fr;\n    }\n\n\n    \/* FAQ *\/\n\n    .tjc-faq-grid{\n        gap:35px;\n    }\n\n\n    \/* FINAL *\/\n\n    .tjc-final{\n        padding:65px 0;\n    }\n\n    .tjc-final-box{\n        padding:55px 20px;\n    }\n\n    .tjc-final h2{\n        font-size:40px;\n    }\n\n    .tjc-final-actions{\n        display:grid;\n        grid-template-columns:1fr;\n    }\n\n    .tjc-final-points{\n        width:max-content;\n        max-width:100%;\n\n        margin:25px auto 0;\n\n        flex-direction:column;\n        align-items:flex-start;\n    }\n\n}\n\n\n\/* ============================================================\n   REDUCED MOTION\n============================================================ *\/\n\n@media(prefers-reduced-motion:reduce){\n\n    .tjc-page *,\n    .tjc-page *::before,\n    .tjc-page *::after{\n        animation:none !important;\n        transition:none !important;\n    }\n\n    .tjc-reveal{\n        opacity:1 !important;\n        transform:none !important;\n    }\n\n}\n\n<\/style>\n\n\n<!-- ============================================================\n     HERO\n============================================================ -->\n\n<section class=\"tjc-hero\">\n\n    <div class=\"tjc-hero-bg\">\n\n        <img decoding=\"async\"\n            src=\"https:\/\/images.pexels.com\/photos\/30130899\/pexels-photo-30130899.jpeg?auto=compress&#038;cs=tinysrgb&#038;w=2000\"\n            alt=\"Cr\u00e9ation de jardin paysager Terra Jardin\"\n            fetchpriority=\"high\">\n\n    <\/div>\n\n    <div class=\"tjc-hero-overlay\"><\/div>\n\n\n    <div class=\"tjc-hero-inner\">\n\n        <div class=\"tjc-hero-content\">\n\n            <div class=\"tjc-hero-badge\">\n\n                <span class=\"tjc-hero-badge-dot\"><\/span>\n\n                Cr\u00e9ation de jardin\n\n            <\/div>\n\n\n            <h1>\n                Imaginez votre jardin.\n                <span>Nous lui donnons vie.<\/span>\n            <\/h1>\n\n\n            <p class=\"tjc-hero-desc\">\n                De la premi\u00e8re id\u00e9e jusqu&rsquo;\u00e0 la r\u00e9alisation,\n                Terra Jardin con\u00e7oit un ext\u00e9rieur harmonieux,\n                pratique et adapt\u00e9 \u00e0 votre terrain,\n                vos envies et votre mani\u00e8re de vivre.\n            <\/p>\n\n\n            <div class=\"tjc-hero-points\">\n\n                <div class=\"tjc-hero-point\">\n                    <span class=\"tjc-check\">\u2713<\/span>\n                    Projet sur mesure\n                <\/div>\n\n                <div class=\"tjc-hero-point\">\n                    <span class=\"tjc-check\">\u2713<\/span>\n                    Am\u00e9nagement complet\n                <\/div>\n\n                <div class=\"tjc-hero-point\">\n                    <span class=\"tjc-check\">\u2713<\/span>\n                    Devis gratuit\n                <\/div>\n\n            <\/div>\n\n\n            <div class=\"tjc-hero-actions\">\n\n                <a\n                    class=\"tjc-btn tjc-btn-gold\"\n                    href=\"\/paysagiste\/contact\/\">\n\n                    Demander un devis\n                    <span class=\"tjc-arrow\">\u2192<\/span>\n\n                <\/a>\n\n                <a\n                    class=\"tjc-btn tjc-btn-light\"\n                    href=\"#creation-jardin\">\n\n                    D\u00e9couvrir la prestation\n                    <span>\u2193<\/span>\n\n                <\/a>\n\n            <\/div>\n\n        <\/div>\n\n\n        <div class=\"tjc-hero-side\">\n\n            <div class=\"tjc-hero-side-main\">\n\n                <img decoding=\"async\"\n                    src=\"https:\/\/images.pexels.com\/photos\/34360409\/pexels-photo-34360409.jpeg?auto=compress&#038;cs=tinysrgb&#038;w=1000\"\n                    alt=\"Jardin am\u00e9nag\u00e9\">\n\n            <\/div>\n\n\n            <div class=\"tjc-floating tjc-floating-top\">\n\n                <strong>\n                    Projet personnalis\u00e9\n                <\/strong>\n\n                <small>\n                    Adapt\u00e9 \u00e0 votre terrain\n                    et \u00e0 vos envies.\n                <\/small>\n\n            <\/div>\n\n\n            <div class=\"tjc-floating tjc-floating-bottom\">\n\n                <strong>\n                    De l&rsquo;id\u00e9e au jardin\n                <\/strong>\n\n                <small>\n                    Un accompagnement complet.\n                <\/small>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n\n<!-- ============================================================\n     BENEFITS\n============================================================ -->\n\n<section class=\"tjc-benefits\">\n\n    <div class=\"tjc-container\">\n\n        <div class=\"tjc-benefits-grid\">\n\n            <div class=\"tjc-benefit tjc-reveal\">\n\n                <div class=\"tjc-benefit-icon\">\n\n                    <svg viewBox=\"0 0 24 24\"\n                         fill=\"none\"\n                         stroke=\"currentColor\"\n                         stroke-width=\"1.7\">\n\n                        <path d=\"M12 3v18\"\/>\n                        <path d=\"M3 12h18\"\/>\n\n                    <\/svg>\n\n                <\/div>\n\n                <strong>Sur mesure<\/strong>\n                <span>Une cr\u00e9ation adapt\u00e9e au terrain.<\/span>\n\n            <\/div>\n\n\n            <div class=\"tjc-benefit tjc-reveal\">\n\n                <div class=\"tjc-benefit-icon\">\n\n                    <svg viewBox=\"0 0 24 24\"\n                         fill=\"none\"\n                         stroke=\"currentColor\"\n                         stroke-width=\"1.7\">\n\n                        <path d=\"M12 21V9\"\/>\n                        <path d=\"M12 13C8 13 5 10 5 6c4 0 7 3 7 7Z\"\/>\n                        <path d=\"M12 10c0-4 3-7 7-7 0 4-3 7-7 7Z\"\/>\n\n                    <\/svg>\n\n                <\/div>\n\n                <strong>V\u00e9g\u00e9tal<\/strong>\n                <span>Des espaces pens\u00e9s pour \u00e9voluer.<\/span>\n\n            <\/div>\n\n\n            <div class=\"tjc-benefit tjc-reveal\">\n\n                <div class=\"tjc-benefit-icon\">\n                    \u2302\n                <\/div>\n\n                <strong>Fonctionnel<\/strong>\n                <span>Un jardin agr\u00e9able \u00e0 vivre.<\/span>\n\n            <\/div>\n\n\n            <div class=\"tjc-benefit tjc-reveal\">\n\n                <div class=\"tjc-benefit-icon\">\n                    \u2713\n                <\/div>\n\n                <strong>Accompagnement<\/strong>\n                <span>De la conception \u00e0 la r\u00e9alisation.<\/span>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n\n<!-- ============================================================\n     INTRO\n============================================================ -->\n\n<section\n    class=\"tjc-section tjc-intro\"\n    id=\"creation-jardin\">\n\n    <div class=\"tjc-container\">\n\n        <div class=\"tjc-intro-grid\">\n\n\n            <div class=\"tjc-intro-image-wrap tjc-reveal\">\n\n                <div class=\"tjc-intro-image\">\n\n                    <img decoding=\"async\"\n                        src=\"https:\/\/images.pexels.com\/photos\/33821329\/pexels-photo-33821329.jpeg?auto=compress&#038;cs=tinysrgb&#038;w=1200\"\n                        loading=\"lazy\"\n                        alt=\"Jardin paysager\">\n\n                <\/div>\n\n\n                <div class=\"tjc-intro-badge\">\n\n                    <small>\n                        Terra Jardin\n                    <\/small>\n\n                    <strong>\n                        Un jardin pens\u00e9 pour vous.\n                    <\/strong>\n\n                <\/div>\n\n            <\/div>\n\n\n            <div>\n\n                <div class=\"tjc-heading tjc-reveal\">\n\n                    <span class=\"tjc-kicker\">\n                        Cr\u00e9ation sur mesure\n                    <\/span>\n\n                    <h2 class=\"tjc-title\">\n                        Votre terrain devient\n                        <span>un v\u00e9ritable lieu de vie.<\/span>\n                    <\/h2>\n\n                    <p class=\"tjc-text\">\n                        Chaque espace est pens\u00e9 pour cr\u00e9er\n                        une circulation naturelle, une ambiance coh\u00e9rente\n                        et un ext\u00e9rieur agr\u00e9able \u00e0 vivre au quotidien.\n                    <\/p>\n\n                <\/div>\n\n\n                <div class=\"tjc-intro-cards\">\n\n                    <div class=\"tjc-intro-card tjc-reveal\">\n\n                        <span>01<\/span>\n\n                        <strong>\n                            Votre terrain\n                        <\/strong>\n\n                        <p>\n                            Surface, exposition et configuration.\n                        <\/p>\n\n                    <\/div>\n\n\n                    <div class=\"tjc-intro-card tjc-reveal\">\n\n                        <span>02<\/span>\n\n                        <strong>\n                            Vos envies\n                        <\/strong>\n\n                        <p>\n                            Style, v\u00e9g\u00e9tation et usages.\n                        <\/p>\n\n                    <\/div>\n\n\n                    <div class=\"tjc-intro-card tjc-reveal\">\n\n                        <span>03<\/span>\n\n                        <strong>\n                            Votre quotidien\n                        <\/strong>\n\n                        <p>\n                            Un jardin pratique \u00e0 utiliser.\n                        <\/p>\n\n                    <\/div>\n\n\n                    <div class=\"tjc-intro-card tjc-reveal\">\n\n                        <span>04<\/span>\n\n                        <strong>\n                            Son \u00e9volution\n                        <\/strong>\n\n                        <p>\n                            Un ext\u00e9rieur pens\u00e9 dans le temps.\n                        <\/p>\n\n                    <\/div>\n\n                <\/div>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n\n<!-- ============================================================\n     NOUVELLE SECTION PREMIUM\n============================================================ -->\n\n<section class=\"tjc-section tjc-included\">\n\n    <div class=\"tjc-container\">\n\n\n        <div class=\"tjc-included-head tjc-reveal\">\n\n            <span class=\"tjc-kicker\">\n                Une cr\u00e9ation compl\u00e8te\n            <\/span>\n\n            <h2 class=\"tjc-title\">\n                Tout ce qu&rsquo;il faut pour\n                <span>cr\u00e9er votre jardin.<\/span>\n            <\/h2>\n\n            <p class=\"tjc-text\">\n                Chaque projet combine les bons \u00e9l\u00e9ments\n                pour cr\u00e9er un ext\u00e9rieur harmonieux,\n                fonctionnel et pens\u00e9 dans son ensemble.\n            <\/p>\n\n        <\/div>\n\n\n        <div class=\"tjc-included-grid\">\n\n\n            <!-- 01 -->\n\n            <article class=\"tjc-included-card tjc-reveal\">\n\n                <div class=\"tjc-included-top\">\n\n                    <div class=\"tjc-included-icon\">\n\n                        <svg viewBox=\"0 0 24 24\"\n                             fill=\"none\"\n                             stroke=\"currentColor\"\n                             stroke-width=\"1.7\">\n\n                            <rect x=\"4\" y=\"4\" width=\"16\" height=\"16\" rx=\"2\"\/>\n                            <path d=\"M8 4v16\"\/>\n                            <path d=\"M16 4v16\"\/>\n                            <path d=\"M4 10h16\"\/>\n\n                        <\/svg>\n\n                    <\/div>\n\n                    <span class=\"tjc-included-number\">\n                        01\n                    <\/span>\n\n                <\/div>\n\n                <h3>\n                    Organisation des espaces\n                <\/h3>\n\n                <p>\n                    R\u00e9partition des zones de vie,\n                    des circulations et de chaque espace\n                    selon votre terrain.\n                <\/p>\n\n                <div class=\"tjc-included-meta\">\n                    Conception globale\n                <\/div>\n\n            <\/article>\n\n\n            <!-- 02 -->\n\n            <article class=\"tjc-included-card tjc-reveal\">\n\n                <div class=\"tjc-included-top\">\n\n                    <div class=\"tjc-included-icon\">\n\n                        <svg viewBox=\"0 0 24 24\"\n                             fill=\"none\"\n                             stroke=\"currentColor\"\n                             stroke-width=\"1.7\">\n\n                            <path d=\"M12 21V9\"\/>\n                            <path d=\"M12 13C8 13 5 10 5 6c4 0 7 3 7 7Z\"\/>\n                            <path d=\"M12 10c0-4 3-7 7-7 0 4-3 7-7 7Z\"\/>\n\n                        <\/svg>\n\n                    <\/div>\n\n                    <span class=\"tjc-included-number\">\n                        02\n                    <\/span>\n\n                <\/div>\n\n                <h3>\n                    Plantations\n                <\/h3>\n\n                <p>\n                    Cr\u00e9ation de massifs\n                    et int\u00e9gration de v\u00e9g\u00e9taux adapt\u00e9s\n                    \u00e0 l&rsquo;ambiance du jardin.\n                <\/p>\n\n                <div class=\"tjc-included-meta\">\n                    V\u00e9g\u00e9tation\n                <\/div>\n\n            <\/article>\n\n\n            <!-- 03 -->\n\n            <article class=\"tjc-included-card tjc-reveal\">\n\n                <div class=\"tjc-included-top\">\n\n                    <div class=\"tjc-included-icon\">\n\n                        <svg viewBox=\"0 0 24 24\"\n                             fill=\"none\"\n                             stroke=\"currentColor\"\n                             stroke-width=\"1.7\">\n\n                            <path d=\"M3 20h18\"\/>\n                            <path d=\"M6 20c0-5 2-8 4-11 1 4 1 7-1 11\"\/>\n                            <path d=\"M12 20c0-7 3-12 6-16 0 7-1 11-4 16\"\/>\n\n                        <\/svg>\n\n                    <\/div>\n\n                    <span class=\"tjc-included-number\">\n                        03\n                    <\/span>\n\n                <\/div>\n\n                <h3>\n                    Pelouse\n                <\/h3>\n\n                <p>\n                    Pr\u00e9paration du terrain\n                    et cr\u00e9ation d&rsquo;un espace engazonn\u00e9\n                    propre et uniforme.\n                <\/p>\n\n                <div class=\"tjc-included-meta\">\n                    Engazonnement\n                <\/div>\n\n            <\/article>\n\n\n            <!-- 04 -->\n\n            <article class=\"tjc-included-card tjc-reveal\">\n\n                <div class=\"tjc-included-top\">\n\n                    <div class=\"tjc-included-icon\">\n\n                        <svg viewBox=\"0 0 24 24\"\n                             fill=\"none\"\n                             stroke=\"currentColor\"\n                             stroke-width=\"1.7\">\n\n                            <path d=\"M4 6h16\"\/>\n                            <path d=\"M4 12h16\"\/>\n                            <path d=\"M4 18h16\"\/>\n                            <path d=\"M8 3v18\"\/>\n                            <path d=\"M16 3v18\"\/>\n\n                        <\/svg>\n\n                    <\/div>\n\n                    <span class=\"tjc-included-number\">\n                        04\n                    <\/span>\n\n                <\/div>\n\n                <h3>\n                    All\u00e9es &#038; circulation\n                <\/h3>\n\n                <p>\n                    Cr\u00e9ation de cheminements pratiques\n                    pour relier naturellement\n                    les diff\u00e9rents espaces.\n                <\/p>\n\n                <div class=\"tjc-included-meta\">\n                    Circulation\n                <\/div>\n\n            <\/article>\n\n\n            <!-- 05 -->\n\n            <article class=\"tjc-included-card tjc-reveal\">\n\n                <div class=\"tjc-included-top\">\n\n                    <div class=\"tjc-included-icon\">\n\n                        <svg viewBox=\"0 0 24 24\"\n                             fill=\"none\"\n                             stroke=\"currentColor\"\n                             stroke-width=\"1.7\">\n\n                            <path d=\"M3 20h18\"\/>\n                            <path d=\"M5 20v-8h6v8\"\/>\n                            <path d=\"M14 20V8h5v12\"\/>\n                            <path d=\"m14 8 5-4\"\/>\n\n                        <\/svg>\n\n                    <\/div>\n\n                    <span class=\"tjc-included-number\">\n                        05\n                    <\/span>\n\n                <\/div>\n\n                <h3>\n                    Espaces d\u00e9tente\n                <\/h3>\n\n                <p>\n                    Terrasse, coin repas\n                    ou espace de repos pour profiter\n                    pleinement de votre jardin.\n                <\/p>\n\n                <div class=\"tjc-included-meta\">\n                    Espace de vie\n                <\/div>\n\n            <\/article>\n\n\n            <!-- 06 -->\n\n            <article class=\"tjc-included-card tjc-reveal\">\n\n                <div class=\"tjc-included-top\">\n\n                    <div class=\"tjc-included-icon\">\n\n                        <svg viewBox=\"0 0 24 24\"\n                             fill=\"none\"\n                             stroke=\"currentColor\"\n                             stroke-width=\"1.8\">\n\n                            <path d=\"m5 12 4 4L19 6\"\/>\n\n                        <\/svg>\n\n                    <\/div>\n\n                    <span class=\"tjc-included-number\">\n                        06\n                    <\/span>\n\n                <\/div>\n\n                <h3>\n                    Finitions\n                <\/h3>\n\n                <p>\n                    Chaque \u00e9l\u00e9ment est harmonis\u00e9\n                    pour obtenir un jardin coh\u00e9rent\n                    jusque dans les d\u00e9tails.\n                <\/p>\n\n                <div class=\"tjc-included-meta\">\n                    R\u00e9sultat final\n                <\/div>\n\n            <\/article>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n\n<!-- ============================================================\n     TYPES\n============================================================ -->\n\n<section class=\"tjc-section tjc-types\">\n\n    <div class=\"tjc-container\">\n\n        <div class=\"tjc-heading tjc-reveal\">\n\n            <span class=\"tjc-kicker\">\n                Votre style\n            <\/span>\n\n            <h2 class=\"tjc-title\">\n                Un jardin qui vous\n                <span>ressemble vraiment.<\/span>\n            <\/h2>\n\n            <p class=\"tjc-text\">\n                Le style du jardin s&rsquo;adapte \u00e0 votre maison,\n                \u00e0 vos pr\u00e9f\u00e9rences et \u00e0 votre quotidien.\n            <\/p>\n\n        <\/div>\n\n\n        <div class=\"tjc-types-grid\">\n\n            <article class=\"tjc-type tjc-reveal\">\n\n                <div class=\"tjc-type-media\">\n\n                    <img decoding=\"async\"\n                        src=\"https:\/\/images.pexels.com\/photos\/34360409\/pexels-photo-34360409.jpeg?auto=compress&#038;cs=tinysrgb&#038;w=1000\"\n                        loading=\"lazy\"\n                        alt=\"Jardin contemporain\">\n\n                <\/div>\n\n                <div class=\"tjc-type-content\">\n\n                    <span>Style 01<\/span>\n\n                    <h3>\n                        Jardin contemporain\n                    <\/h3>\n\n                    <p>\n                        Lignes structur\u00e9es,\n                        v\u00e9g\u00e9tation ma\u00eetris\u00e9e et espaces \u00e9pur\u00e9s.\n                    <\/p>\n\n                <\/div>\n\n            <\/article>\n\n\n            <article class=\"tjc-type tjc-reveal\">\n\n                <div class=\"tjc-type-media\">\n\n                    <img decoding=\"async\"\n                        src=\"https:\/\/images.pexels.com\/photos\/30130899\/pexels-photo-30130899.jpeg?auto=compress&#038;cs=tinysrgb&#038;w=1000\"\n                        loading=\"lazy\"\n                        alt=\"Jardin v\u00e9g\u00e9tal\">\n\n                <\/div>\n\n                <div class=\"tjc-type-content\">\n\n                    <span>Style 02<\/span>\n\n                    <h3>\n                        Jardin v\u00e9g\u00e9tal\n                    <\/h3>\n\n                    <p>\n                        Une ambiance naturelle\n                        avec davantage de v\u00e9g\u00e9tation.\n                    <\/p>\n\n                <\/div>\n\n            <\/article>\n\n\n            <article class=\"tjc-type tjc-reveal\">\n\n                <div class=\"tjc-type-media\">\n\n                    <img decoding=\"async\"\n                        src=\"https:\/\/images.pexels.com\/photos\/7546775\/pexels-photo-7546775.jpeg?auto=compress&#038;cs=tinysrgb&#038;w=1000\"\n                        loading=\"lazy\"\n                        alt=\"Jardin familial\">\n\n                <\/div>\n\n                <div class=\"tjc-type-content\">\n\n                    <span>Style 03<\/span>\n\n                    <h3>\n                        Jardin \u00e0 vivre\n                    <\/h3>\n\n                    <p>\n                        Des espaces pens\u00e9s pour recevoir,\n                        partager et se d\u00e9tendre.\n                    <\/p>\n\n                <\/div>\n\n            <\/article>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n\n<!-- ============================================================\n     TRANSFORMATION\n============================================================ -->\n\n<section class=\"tjc-section tjc-transform\">\n\n    <div class=\"tjc-container\">\n\n        <div class=\"tjc-transform-box tjc-reveal\">\n\n            <img decoding=\"async\"\n                src=\"https:\/\/images.pexels.com\/photos\/30130899\/pexels-photo-30130899.jpeg?auto=compress&#038;cs=tinysrgb&#038;w=1800\"\n                loading=\"lazy\"\n                alt=\"Transformation de jardin\">\n\n\n            <div class=\"tjc-transform-content\">\n\n                <span class=\"tjc-transform-tag\">\n                    Avant \/ Apr\u00e8s\n                <\/span>\n\n                <h2>\n                    D&rsquo;un terrain vide\n                    \u00e0 <span>un jardin \u00e0 vivre.<\/span>\n                <\/h2>\n\n                <p>\n                    Pr\u00e9sentez ici les v\u00e9ritables photos\n                    avant et apr\u00e8s du m\u00eame chantier.\n                <\/p>\n\n\n                <div class=\"tjc-transform-chips\">\n\n                    <span>Pr\u00e9paration<\/span>\n                    <span>\u2192<\/span>\n                    <span>Am\u00e9nagement<\/span>\n                    <span>\u2192<\/span>\n                    <span>Jardin termin\u00e9<\/span>\n\n                <\/div>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n\n<!-- ============================================================\n     PROCESS\n============================================================ -->\n\n<section\n    class=\"tjc-section tjc-process\"\n    data-tjc-process>\n\n    <div class=\"tjc-container\">\n\n        <div class=\"tjc-heading tjc-heading-center tjc-reveal\">\n\n            <span class=\"tjc-kicker\">\n                Votre projet\n            <\/span>\n\n            <h2 class=\"tjc-title\">\n                Comment se d\u00e9roule\n                <span>une cr\u00e9ation de jardin ?<\/span>\n            <\/h2>\n\n        <\/div>\n\n\n        <div class=\"tjc-process-wrap\">\n\n            <div class=\"tjc-process-line\">\n                <div class=\"tjc-process-progress\"><\/div>\n            <\/div>\n\n\n            <div class=\"tjc-process-grid\">\n\n                <article class=\"tjc-process-step\">\n\n                    <div class=\"tjc-process-number\">01<\/div>\n\n                    <h3>\u00c9change<\/h3>\n\n                    <p>\n                        D\u00e9finition de vos besoins.\n                    <\/p>\n\n                <\/article>\n\n\n                <article class=\"tjc-process-step\">\n\n                    <div class=\"tjc-process-number\">02<\/div>\n\n                    <h3>\u00c9tude<\/h3>\n\n                    <p>\n                        Analyse du terrain.\n                    <\/p>\n\n                <\/article>\n\n\n                <article class=\"tjc-process-step\">\n\n                    <div class=\"tjc-process-number\">03<\/div>\n\n                    <h3>Conception<\/h3>\n\n                    <p>\n                        Organisation des espaces.\n                    <\/p>\n\n                <\/article>\n\n\n                <article class=\"tjc-process-step\">\n\n                    <div class=\"tjc-process-number\">04<\/div>\n\n                    <h3>R\u00e9alisation<\/h3>\n\n                    <p>\n                        Le jardin prend forme.\n                    <\/p>\n\n                <\/article>\n\n\n                <article class=\"tjc-process-step\">\n\n                    <div class=\"tjc-process-number\">05<\/div>\n\n                    <h3>Livraison<\/h3>\n\n                    <p>\n                        Votre ext\u00e9rieur est pr\u00eat.\n                    <\/p>\n\n                <\/article>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n\n<!-- ============================================================\n     RELATED\n============================================================ -->\n\n<section class=\"tjc-section tjc-related\">\n\n    <div class=\"tjc-container\">\n\n        <div class=\"tjc-heading tjc-reveal\">\n\n            <span class=\"tjc-kicker\">\n                Compl\u00e9ter votre projet\n            <\/span>\n\n            <h2 class=\"tjc-title\">\n                Votre jardin peut aller\n                <span>encore plus loin.<\/span>\n            <\/h2>\n\n        <\/div>\n\n\n        <div class=\"tjc-related-grid\">\n\n            <a\n                class=\"tjc-related-card tjc-reveal\"\n                href=\"\/paysagiste\/terrasses-allees\/\">\n\n                <img decoding=\"async\"\n                    src=\"https:\/\/images.pexels.com\/photos\/7546775\/pexels-photo-7546775.jpeg?auto=compress&#038;cs=tinysrgb&#038;w=1000\"\n                    loading=\"lazy\"\n                    alt=\"Terrasses et all\u00e9es\">\n\n                <div class=\"tjc-related-content\">\n\n                    <span>\n                        Service compl\u00e9mentaire\n                    <\/span>\n\n                    <strong>\n                        Terrasses &#038; all\u00e9es \u2192\n                    <\/strong>\n\n                    <small>\n                        Structurez votre ext\u00e9rieur.\n                    <\/small>\n\n                <\/div>\n\n            <\/a>\n\n\n            <a\n                class=\"tjc-related-card tjc-reveal\"\n                href=\"\/paysagiste\/engazonnement\/\">\n\n                <img decoding=\"async\"\n                    src=\"https:\/\/images.pexels.com\/photos\/5231232\/pexels-photo-5231232.jpeg?auto=compress&#038;cs=tinysrgb&#038;w=1000\"\n                    loading=\"lazy\"\n                    alt=\"Engazonnement\">\n\n                <div class=\"tjc-related-content\">\n\n                    <span>\n                        Service compl\u00e9mentaire\n                    <\/span>\n\n                    <strong>\n                        Engazonnement \u2192\n                    <\/strong>\n\n                    <small>\n                        Cr\u00e9ez une nouvelle pelouse.\n                    <\/small>\n\n                <\/div>\n\n            <\/a>\n\n\n            <a\n                class=\"tjc-related-card tjc-reveal\"\n                href=\"\/paysagiste\/entretien-jardin\/\">\n\n                <img decoding=\"async\"\n                    src=\"https:\/\/images.pexels.com\/photos\/14505857\/pexels-photo-14505857.jpeg?auto=compress&#038;cs=tinysrgb&#038;w=1000\"\n                    loading=\"lazy\"\n                    alt=\"Entretien jardin\">\n\n                <div class=\"tjc-related-content\">\n\n                    <span>\n                        Apr\u00e8s la cr\u00e9ation\n                    <\/span>\n\n                    <strong>\n                        Entretien de jardin \u2192\n                    <\/strong>\n\n                    <small>\n                        Pr\u00e9servez votre nouvel ext\u00e9rieur.\n                    <\/small>\n\n                <\/div>\n\n            <\/a>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n\n<!-- ============================================================\n     FAQ\n============================================================ -->\n\n<section class=\"tjc-section tjc-faq\">\n\n    <div class=\"tjc-container\">\n\n        <div class=\"tjc-faq-grid\">\n\n            <div class=\"tjc-faq-intro tjc-reveal\">\n\n                <span class=\"tjc-kicker\">\n                    Questions fr\u00e9quentes\n                <\/span>\n\n                <h2 class=\"tjc-title\">\n                    Votre projet,\n                    <span>vos questions.<\/span>\n                <\/h2>\n\n            <\/div>\n\n\n            <div class=\"tjc-faq-list\">\n\n                <details class=\"tjc-faq-item tjc-reveal\">\n\n                    <summary>\n                        Peut-on cr\u00e9er un jardin sur un terrain vide ?\n                    <\/summary>\n\n                    <div class=\"tjc-faq-answer\">\n                        Oui. Le projet peut partir d&rsquo;un terrain vide\n                        et int\u00e9grer plantations, pelouse,\n                        circulations et espaces de vie.\n                    <\/div>\n\n                <\/details>\n\n\n                <details class=\"tjc-faq-item tjc-reveal\">\n\n                    <summary>\n                        Peut-on r\u00e9am\u00e9nager un jardin existant ?\n                    <\/summary>\n\n                    <div class=\"tjc-faq-answer\">\n                        Oui. Il est possible de conserver\n                        certains \u00e9l\u00e9ments et de transformer\n                        les espaces qui ne correspondent plus\n                        \u00e0 vos besoins.\n                    <\/div>\n\n                <\/details>\n\n\n                <details class=\"tjc-faq-item tjc-reveal\">\n\n                    <summary>\n                        Peut-on int\u00e9grer une terrasse ?\n                    <\/summary>\n\n                    <div class=\"tjc-faq-answer\">\n                        Oui. La terrasse peut \u00eatre int\u00e9gr\u00e9e\n                        directement dans la conception globale.\n                    <\/div>\n\n                <\/details>\n\n\n                <details class=\"tjc-faq-item tjc-reveal\">\n\n                    <summary>\n                        Peut-on pr\u00e9voir l&rsquo;entretien ensuite ?\n                    <\/summary>\n\n                    <div class=\"tjc-faq-answer\">\n                        Oui. Une prestation d&rsquo;entretien peut\n                        compl\u00e9ter la cr\u00e9ation du jardin.\n                    <\/div>\n\n                <\/details>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n\n<!-- ============================================================\n     FINAL CTA\n============================================================ -->\n\n<section class=\"tjc-final\">\n\n    <div class=\"tjc-container\">\n\n        <div class=\"tjc-final-box tjc-reveal\">\n\n            <div class=\"tjc-final-content\">\n\n                <span class=\"tjc-kicker\">\n                    Cr\u00e9ation de jardin\n                <\/span>\n\n                <h2>\n                    Votre futur jardin\n                    commence par <span>une id\u00e9e.<\/span>\n                <\/h2>\n\n                <p>\n                    Pr\u00e9sentez-nous votre terrain\n                    et vos envies pour imaginer\n                    un ext\u00e9rieur qui vous ressemble.\n                <\/p>\n\n\n                <div class=\"tjc-final-actions\">\n\n                    <a\n                        class=\"tjc-btn tjc-btn-gold\"\n                        href=\"\/paysagiste\/contact\/\">\n\n                        Demander un devis\n                        <span class=\"tjc-arrow\">\u2192<\/span>\n\n                    <\/a>\n\n\n                    <a\n                        class=\"tjc-btn tjc-btn-light\"\n                        href=\"\/paysagiste\/realisations\/\">\n\n                        Voir nos r\u00e9alisations\n                        <span class=\"tjc-arrow\">\u2192<\/span>\n\n                    <\/a>\n\n                <\/div>\n\n\n                <div class=\"tjc-final-points\">\n\n                    <span class=\"tjc-final-point\">\n                        <span class=\"tjc-check\">\u2713<\/span>\n                        Devis gratuit\n                    <\/span>\n\n                    <span class=\"tjc-final-point\">\n                        <span class=\"tjc-check\">\u2713<\/span>\n                        Projet sur mesure\n                    <\/span>\n\n                    <span class=\"tjc-final-point\">\n                        <span class=\"tjc-check\">\u2713<\/span>\n                        Cr\u00e9ation compl\u00e8te\n                    <\/span>\n\n                <\/div>\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n\n<script>\n(function(){\n\n    \"use strict\";\n\n\n    function initTerraCreation(){\n\n        var root =\n            document.querySelector(\".tjc-page\");\n\n        if(!root){\n            return;\n        }\n\n\n        var reducedMotion = false;\n\n\n        try{\n\n            reducedMotion =\n                window.matchMedia(\n                    \"(prefers-reduced-motion: reduce)\"\n                ).matches;\n\n        }catch(error){\n\n            reducedMotion = false;\n\n        }\n\n\n\n        \/* ==================================================\n           REVEAL\n        ================================================== *\/\n\n        try{\n\n            var revealItems =\n                root.querySelectorAll(\n                    \".tjc-reveal\"\n                );\n\n\n            if(\n                reducedMotion ||\n                !(\"IntersectionObserver\" in window)\n            ){\n\n                revealItems.forEach(\n                    function(item){\n\n                        item.classList.add(\n                            \"tjc-visible\"\n                        );\n\n                    }\n                );\n\n            }else{\n\n                var viewport =\n                    window.innerHeight ||\n                    document.documentElement.clientHeight;\n\n\n                revealItems.forEach(\n                    function(item){\n\n                        var rect =\n                            item.getBoundingClientRect();\n\n\n                        if(\n                            rect.top <\n                            viewport * .94\n                        ){\n\n                            item.classList.add(\n                                \"tjc-visible\"\n                            );\n\n                        }\n\n                    }\n                );\n\n\n                var observer =\n                    new IntersectionObserver(\n\n                        function(entries){\n\n                            entries.forEach(\n                                function(entry){\n\n                                    if(\n                                        entry.isIntersecting\n                                    ){\n\n                                        entry.target\n                                            .classList\n                                            .add(\n                                                \"tjc-visible\"\n                                            );\n\n\n                                        observer\n                                            .unobserve(\n                                                entry.target\n                                            );\n\n                                    }\n\n                                }\n                            );\n\n                        },\n\n                        {\n                            threshold:.12,\n                            rootMargin:\n                                \"0px 0px -45px 0px\"\n                        }\n\n                    );\n\n\n                revealItems.forEach(\n                    function(item){\n\n                        observer.observe(\n                            item\n                        );\n\n                    }\n                );\n\n\n                root.classList.add(\n                    \"tjc-motion-ready\"\n                );\n\n            }\n\n        }catch(error){\n\n            root.classList.remove(\n                \"tjc-motion-ready\"\n            );\n\n        }\n\n\n\n        \/* ==================================================\n           TIMELINE\n        ================================================== *\/\n\n        try{\n\n            var process =\n                root.querySelector(\n                    \"[data-tjc-process]\"\n                );\n\n\n            if(!process){\n                return;\n            }\n\n\n            var steps =\n                process.querySelectorAll(\n                    \".tjc-process-step\"\n                );\n\n\n            var ticking = false;\n\n\n            function clamp(\n                value,\n                min,\n                max\n            ){\n\n                return Math.min(\n                    Math.max(\n                        value,\n                        min\n                    ),\n                    max\n                );\n\n            }\n\n\n            function updateProcess(){\n\n                ticking = false;\n\n\n                var rect =\n                    process.getBoundingClientRect();\n\n\n                var viewport =\n                    window.innerHeight ||\n                    document.documentElement.clientHeight;\n\n\n                var start =\n                    viewport * .78;\n\n\n                var distance =\n                    Math.max(\n                        rect.height +\n                        viewport * .20,\n                        1\n                    );\n\n\n                var progress =\n                    (\n                        start -\n                        rect.top\n                    ) \/\n                    distance;\n\n\n                progress =\n                    clamp(\n                        progress,\n                        0,\n                        1\n                    );\n\n\n                process.style.setProperty(\n                    \"--tjc-progress\",\n                    progress.toFixed(4)\n                );\n\n\n                var thresholds =\n                    [\n                        .03,\n                        .24,\n                        .45,\n                        .67,\n                        .88\n                    ];\n\n\n                steps.forEach(\n                    function(step,index){\n\n                        if(\n                            progress >=\n                            thresholds[index]\n                        ){\n\n                            step.classList.add(\n                                \"tjc-active\"\n                            );\n\n                        }else{\n\n                            step.classList.remove(\n                                \"tjc-active\"\n                            );\n\n                        }\n\n                    }\n                );\n\n            }\n\n\n            function requestProcess(){\n\n                if(ticking){\n                    return;\n                }\n\n                ticking = true;\n\n                requestAnimationFrame(\n                    updateProcess\n                );\n\n            }\n\n\n            if(reducedMotion){\n\n                process.style.setProperty(\n                    \"--tjc-progress\",\n                    \"1\"\n                );\n\n\n                steps.forEach(\n                    function(step){\n\n                        step.classList.add(\n                            \"tjc-active\"\n                        );\n\n                    }\n                );\n\n            }else{\n\n                window.addEventListener(\n                    \"scroll\",\n                    requestProcess,\n                    {\n                        passive:true\n                    }\n                );\n\n\n                window.addEventListener(\n                    \"resize\",\n                    requestProcess\n                );\n\n\n                updateProcess();\n\n            }\n\n        }catch(error){\n\n            \/* page reste visible *\/\n\n        }\n\n    }\n\n\n\n    if(\n        document.readyState === \"loading\"\n    ){\n\n        document.addEventListener(\n            \"DOMContentLoaded\",\n            initTerraCreation\n        );\n\n    }else{\n\n        initTerraCreation();\n\n    }\n\n})();\n<\/script>\n\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Cr\u00e9ation de jardin Imaginez votre jardin. Nous lui donnons vie. De la premi\u00e8re id\u00e9e jusqu&rsquo;\u00e0 la r\u00e9alisation, Terra Jardin con\u00e7oit un ext\u00e9rieur harmonieux, pratique et adapt\u00e9 \u00e0 votre terrain, vos envies et votre mani\u00e8re de vivre. \u2713 Projet sur mesure \u2713 Am\u00e9nagement complet \u2713 Devis gratuit Demander un devis \u2192 D\u00e9couvrir la prestation \u2193 Projet [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-17","page","type-page","status-publish","hentry"],"blocksy_meta":{"styles_descriptor":{"styles":{"desktop":"","tablet":"","mobile":""},"google_fonts":[],"version":8}},"_links":{"self":[{"href":"https:\/\/demo.jouglet-web.fr\/paysagiste\/wp-json\/wp\/v2\/pages\/17","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/demo.jouglet-web.fr\/paysagiste\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/demo.jouglet-web.fr\/paysagiste\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/demo.jouglet-web.fr\/paysagiste\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/demo.jouglet-web.fr\/paysagiste\/wp-json\/wp\/v2\/comments?post=17"}],"version-history":[{"count":3,"href":"https:\/\/demo.jouglet-web.fr\/paysagiste\/wp-json\/wp\/v2\/pages\/17\/revisions"}],"predecessor-version":[{"id":69,"href":"https:\/\/demo.jouglet-web.fr\/paysagiste\/wp-json\/wp\/v2\/pages\/17\/revisions\/69"}],"wp:attachment":[{"href":"https:\/\/demo.jouglet-web.fr\/paysagiste\/wp-json\/wp\/v2\/media?parent=17"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}