:root{--ink:#071827;--muted:#607482;--line:#dce8eb}.demo-body{margin:0;min-height:100vh;background:radial-gradient(circle at 10% 18%,rgba(58,220,199,.13),transparent 25%),radial-gradient(circle at 92% 78%,rgba(73,137,255,.12),transparent 28%),#f3f8f9;color:var(--ink)}.demo-header{position:relative;max-width:1280px;background:transparent;border:0}.demo-back{color:#315166;font-weight:700;font-size:14px}.demo-main{width:min(1240px,calc(100% - 48px));margin:54px auto 70px;display:grid;grid-template-columns:minmax(0,.88fr) minmax(520px,1.12fr);gap:90px;align-items:start}.demo-intro{position:sticky;top:50px;padding-top:34px}.demo-intro .eyebrow{color:#138f83}.demo-intro h1{font:800 clamp(48px,5vw,72px)/1.02 Manrope,sans-serif;letter-spacing:-.055em;margin:22px 0;color:var(--ink)}.demo-intro>p{font-size:19px;line-height:1.7;color:#536b79}.demo-benefits{margin:45px 0 30px;display:grid;gap:13px}.demo-benefits>div{display:grid;grid-template-columns:46px 1fr;gap:2px 16px;padding:17px 0;border-bottom:1px solid rgba(26,74,88,.12)}.demo-benefits span{grid-row:1/3;width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:#e0f8f4;color:#078c7e;font-size:12px;font-weight:800}.demo-benefits strong{font:700 16px Manrope,sans-serif}.demo-benefits small{color:#6e818c;font-size:13px}.demo-reassurance{display:flex;flex-wrap:wrap;gap:9px}.demo-reassurance span{background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 11px;color:#476170;font-size:12px;font-weight:700}.form-card{background:rgba(255,255,255,.96);border:1px solid #cfe0e3;border-radius:30px;padding:46px;box-shadow:0 32px 90px rgba(20,55,68,.13)}.form-heading>span{color:#0d9c8e;font-size:11px;text-transform:uppercase;letter-spacing:.13em;font-weight:800}.form-heading h2{font:800 32px/1.15 Manrope,sans-serif;letter-spacing:-.035em;margin:10px 0}.form-heading p{font-size:13px;color:#71838d;margin-bottom:32px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px}.field{margin-bottom:19px}.field label,.choice-field legend{display:block;font-size:13px;font-weight:800;color:#264554;margin:0 0 8px}.field label span,.choice-field legend span,.consent strong{color:#078f83}.field label em{color:#8a9aa3;font-size:11px;font-weight:500;font-style:normal}.field input,.field select,.field textarea{width:100%;border:1px solid #cfdee2;border-radius:12px;background:#fbfdfd;color:#102b39;font:500 15px DM Sans,sans-serif;padding:14px 15px;outline:0;transition:.2s}.field textarea{resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:#21baa9;box-shadow:0 0 0 4px rgba(33,186,169,.12);background:#fff}.choice-field{border:0;padding:0;margin:2px 0 21px}.choice-field label{display:inline-flex;align-items:center;gap:8px;padding:11px 14px;margin-right:7px;border:1px solid #cfdee2;border-radius:12px;background:#fbfdfd;font-size:14px;font-weight:700}.choice-field input,.consent input{accent-color:#0bab9a;width:17px;height:17px}.consent{display:flex;align-items:flex-start;gap:11px;color:#58707e;font-size:12px;line-height:1.55}.consent input{flex:0 0 auto}.consent a,.privacy-note a{color:#087f75;text-decoration:underline}.submit-button{width:100%;margin-top:23px;border:0;border-radius:13px;background:linear-gradient(120deg,#2be0c9,#24c5b8 58%,#4a8dff);color:#042b2b;font:800 15px Manrope,sans-serif;padding:17px;cursor:pointer;box-shadow:0 15px 35px rgba(27,191,174,.25)}.submit-button:disabled{opacity:.65}.form-footnote{text-align:center;color:#82939c;font-size:11px}.form-error{margin-top:18px;padding:12px 14px;border-radius:10px;background:#fff0f0;color:#9f2d2d;font-size:13px;font-weight:700}.form-success{text-align:center;padding:60px 15px}.form-success>b{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 24px;border-radius:50%;background:#dcfaf5;color:#078d7f;font-size:29px}.form-success h2{font:800 30px Manrope,sans-serif}.form-success p{color:#647b87}.form-success a{color:#078d7f;font-weight:800}.hp-field{position:absolute!important;left:-9999px!important}.privacy-note{width:min(1040px,calc(100% - 48px));margin:0 auto 50px;padding:25px 28px;border:1px solid var(--line);border-radius:17px;background:#ffffffa8;color:#667c87;font-size:12px;line-height:1.65}.privacy-note p{margin:6px 0 0}.demo-footer{padding:25px max(24px,calc((100vw - 1240px)/2));border-top:1px solid #d9e5e7;display:flex;justify-content:space-between;color:#73868f;font-size:12px}.demo-footer a{color:#087f75;font-weight:700}@media(max-width:980px){.demo-main{grid-template-columns:1fr;gap:35px;max-width:760px}.demo-intro{position:static;padding-top:0}.form-card{padding:40px}}@media(max-width:680px){.demo-header{height:76px;padding:0 20px}.demo-main{width:calc(100% - 28px);margin:28px auto 48px}.demo-intro h1{font-size:43px}.demo-intro>p{font-size:17px}.form-card{padding:28px 19px;border-radius:22px}.field-grid{grid-template-columns:1fr;gap:0}.choice-field label{display:flex;margin:0 0 8px}.privacy-note{width:calc(100% - 28px)}.demo-footer{flex-direction:column;gap:8px}}

/* Harmonisation complète avec le design system du site principal. */
.demo-body{background:#f3f8f9}
.demo-body::before{content:"";position:absolute;z-index:0;inset:78px 0 auto;height:620px;pointer-events:none;background:radial-gradient(circle at 13% 18%,rgba(37,214,190,.19),transparent 30%),radial-gradient(circle at 85% 10%,rgba(36,107,254,.2),transparent 33%)}
.demo-header{width:100%;max-width:none;position:sticky;padding-inline:max(24px,calc((100vw - 1132px)/2));background:radial-gradient(circle at 78% 140%,rgba(36,107,254,.16),transparent 34%),radial-gradient(circle at 94% 20%,rgba(27,205,186,.13),transparent 26%),linear-gradient(105deg,rgba(4,13,25,.98),rgba(7,24,39,.98) 58%,rgba(5,46,54,.97));border-bottom:1px solid rgba(112,222,210,.14)}
.demo-header .brand{color:#fff}.demo-header .demo-back{margin-left:8px;color:#e9ffff;font-size:15px}.demo-header .demo-back:hover{color:#fff}
.demo-main{position:relative;z-index:1;margin-top:0;padding-top:72px;gap:clamp(48px,7vw,90px)}
.demo-main::before{content:"";position:absolute;z-index:-1;top:0;bottom:0;left:50%;width:100vw;transform:translateX(-50%);background:radial-gradient(circle at 13% 18%,rgba(37,214,190,.14),transparent 31%),radial-gradient(circle at 86% 8%,rgba(36,107,254,.16),transparent 34%),linear-gradient(145deg,#061321,#08283a)}
.demo-intro{top:118px;padding-top:22px;color:#fff}.demo-intro .eyebrow{padding:9px 14px;border:1px solid rgba(106,235,218,.28);border-radius:999px;background:rgba(106,235,218,.09);color:#7df3e3}
.demo-intro h1{color:#fff;text-wrap:balance}.demo-intro>p{max-width:590px;color:#bfd0da;font-size:18px}
.demo-benefits>div{padding:18px 0;border-color:rgba(255,255,255,.11)}.demo-benefits span{background:linear-gradient(145deg,rgba(42,219,198,.2),rgba(54,126,242,.18));border:1px solid rgba(100,235,218,.22);color:#77eee0}.demo-benefits strong{color:#fff;font-size:17px}.demo-benefits small{color:#9fb4c0;font-size:14px}
.demo-reassurance span{border-color:rgba(108,232,216,.2);background:rgba(255,255,255,.055);color:#d9e8ec;font-size:13px}
.form-card{border-color:rgba(103,225,210,.32);background:rgba(255,255,255,.985);box-shadow:0 42px 110px rgba(1,18,31,.3),0 0 0 1px rgba(255,255,255,.08)}
.form-heading>span{display:inline-flex;padding:8px 11px;border:1px solid #bde7e1;border-radius:999px;background:#e9f8f5}.form-heading h2{color:#09283b;font-size:35px}.form-heading p{color:#667d89}
.field input,.field select,.field textarea{min-height:50px}.field textarea{min-height:118px}.choice-field label{transition:border-color .2s,background .2s,transform .2s}.choice-field label:hover{border-color:#93dcd2;background:#effbf9;transform:translateY(-1px)}
.submit-button{min-height:56px;color:#fff;background:linear-gradient(135deg,#087f86,#16b8a7 62%,#357fee);box-shadow:0 16px 38px rgba(14,145,153,.25);transition:transform .2s,box-shadow .2s}.submit-button:hover{transform:translateY(-2px);box-shadow:0 20px 44px rgba(14,145,153,.34)}
.privacy-note{position:relative;z-index:1;margin-top:14px;margin-bottom:70px;border-color:#d4e5e7;background:rgba(255,255,255,.9);box-shadow:0 12px 36px rgba(10,48,64,.07);font-size:14px}
.demo-body .site-footer{position:relative;z-index:1}
@media(max-width:980px){.demo-body::before{height:790px}.demo-main{padding-top:45px}.demo-intro{max-width:700px}.form-card{margin-top:4px}}
@media(max-width:760px){.demo-header .header-cta{display:none}.demo-header .nav-demo-mobile{display:block}.demo-body::before{top:66px;height:800px}.demo-main{padding-top:38px}.demo-intro h1{font-size:clamp(40px,12vw,52px)}.demo-benefits{margin-top:32px}.form-card{margin-top:8px}.privacy-note{margin-bottom:48px}}

/* Garanties : groupe UX autonome, régulier et suffisamment espacé. */
.demo-reassurance{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:30px}
.demo-reassurance span{min-height:42px;display:flex;align-items:center;justify-content:center;padding:8px 10px;text-align:center}
@media(max-width:980px){.demo-main{gap:64px}}
@media(max-width:760px){.demo-main{gap:56px}.demo-reassurance{grid-template-columns:1fr 1fr;margin-bottom:8px}.demo-reassurance span:last-child{grid-column:1/-1}}

/* Respiration entre la carte formulaire et la zone Confidentialité. */
.demo-main{padding-bottom:72px;margin-bottom:0}
.privacy-note{margin-top:64px}
@media(max-width:760px){.demo-main{padding-bottom:48px}.privacy-note{margin-top:42px}}
