/* ═══════════════════════════════════════════════════════════════ GABARIT « PAGE DOMAINE » · RunoLabs Partagé par fiduciaires.html, voyages, immobilier, juridique, médical. Sept blocs, toujours dans cet ordre : 1 .dp-hero accroche 2 .dp-tools vos outils restent en place (3 colonnes) 3 .dp-agents les agents (4 cartes + 1 carte sur mesure) 4 .dp-start comment ça démarre (étapes + tableau d'audit) 5 .dp-pricing tarifs (tableau + encadré + mention) 6 .dp-privacy confidentialité et données 7 .dp-contact contact Seul le contenu HTML change d'un domaine à l'autre. ═══════════════════════════════════════════════════════════════ */ /* ─── VARIABLES (charte RunoLabs) ─── */ :root{ --bg:#f6f3ec; --black:#0a0a0a; --white:#101c2c; --cream:#ede9e2; --accent:#1f7a4d; --muted:#5b6470; --card:#ffffff; --border:rgba(16,28,44,0.08); --navy:#101c2c; --cream-light:#f6f3ec; --radius:14px; } *{margin:0;padding:0;box-sizing:border-box;} html{scroll-behavior:smooth;} body{background:var(--bg);color:var(--white);font-family:'DM Sans',sans-serif;font-size:16px;line-height:1.6;overflow-x:hidden;} ::-webkit-scrollbar{width:6px;} ::-webkit-scrollbar-track{background:var(--bg);} ::-webkit-scrollbar-thumb{background:#cbd0d3;border-radius:3px;} /* ─── NAV (identique aux autres pages) ─── */ nav{position:fixed;top:0;left:0;right:0;z-index:200;display:flex;align-items:center;justify-content:space-between;padding:18px 48px;background:rgba(246,243,236,0.85);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid var(--border);transition:padding 0.3s;} nav.nav-scrolled{padding:12px 48px;} .logo{font-family:'Syne',sans-serif;font-weight:800;font-size:22px;letter-spacing:-0.5px;color:var(--white);text-decoration:none;} .logo span{color:var(--accent);} .nav-links{display:flex;gap:28px;list-style:none;align-items:center;} .nav-links a{color:var(--muted);text-decoration:none;font-size:14px;transition:color 0.2s;} .nav-links a:hover{color:var(--white);} .nav-cta{background:var(--accent);color:var(--black)!important;padding:10px 22px;border-radius:100px;font-weight:500!important;} .nav-cta:hover{opacity:0.85;} /* ─── SOUS-MENU SECTEURS ─── */ .nav-dropdown{position:relative;} .nav-dropdown>a{display:inline-flex;align-items:center;gap:5px;} .nav-caret{width:11px;height:11px;transition:transform 0.2s;} .nav-dropdown:hover .nav-caret{transform:rotate(180deg);} .nav-dropdown-menu{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(6px);background:var(--card);border:1px solid var(--border);border-radius:14px;padding:8px;min-width:230px;box-shadow:0 14px 36px rgba(16,28,44,0.1);opacity:0;visibility:hidden;pointer-events:none;transition:opacity 0.2s,transform 0.2s;z-index:250;} .nav-dropdown:hover .nav-dropdown-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(2px);} .nav-dropdown-menu a{display:block;padding:10px 14px;border-radius:8px;font-size:13.5px;color:var(--muted)!important;text-decoration:none;white-space:nowrap;} .nav-dropdown-menu a:hover{background:rgba(31,122,77,0.07);color:var(--white)!important;} .nav-burger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:4px;} .nav-burger span{display:block;width:22px;height:2px;background:var(--white);border-radius:2px;} .mobile-menu{display:none;position:fixed;inset:0;background:rgba(246,243,236,0.98);z-index:190;flex-direction:column;align-items:center;justify-content:center;gap:36px;} .mobile-menu.open{display:flex;} .mobile-menu a{font-family:'Syne',sans-serif;font-size:28px;font-weight:700;color:var(--white);text-decoration:none;} .mobile-menu a:hover{color:var(--accent);} .mobile-menu .m-cta{background:var(--accent);color:var(--black)!important;padding:14px 36px;border-radius:100px;font-size:18px!important;} /* ─── ÉLÉMENTS COMMUNS ─── */ .dp-wrap{max-width:1120px;margin:0 auto;} .section-label{font-size:11px;font-weight:500;letter-spacing:0.14em;text-transform:uppercase;color:var(--accent);margin-bottom:16px;display:block;} .dp-section{padding:110px 48px;border-top:1px solid var(--border);} .dp-h2{font-family:'Syne',sans-serif;font-size:clamp(23px,2.8vw,32px);font-weight:700;letter-spacing:-0.5px;line-height:1.2;max-width:760px;margin-bottom:18px;} .dp-lead{font-size:15.5px;color:var(--muted);line-height:1.7;max-width:660px;} .dp-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:36px;} .btn-primary{background:var(--accent);color:var(--black);padding:14px 30px;border-radius:100px;font-weight:500;font-size:15px;text-decoration:none;transition:transform 0.2s,box-shadow 0.2s;display:inline-block;} .btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 30px rgba(31,122,77,0.25);} .btn-ghost{color:var(--white);padding:14px 30px;border-radius:100px;font-size:15px;text-decoration:none;border:1px solid rgba(16,28,44,0.18);transition:border-color 0.2s,background 0.2s;display:inline-block;} .btn-ghost:hover{border-color:var(--white);background:rgba(16,28,44,0.03);} .nbsp{white-space:nowrap;} /* ─── 1 · ACCROCHE ─── */ .dp-hero{position:relative;overflow:hidden;padding:170px 48px 110px;} .dp-hero-bg{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 60% 50% at 75% 35%,rgba(31,122,77,0.08) 0%,transparent 70%);} .dp-hero-grid{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(16,28,44,0.04) 1px,transparent 1px),linear-gradient(90deg,rgba(16,28,44,0.04) 1px,transparent 1px);background-size:60px 60px;-webkit-mask-image:linear-gradient(to bottom,#000 40%,transparent);mask-image:linear-gradient(to bottom,#000 40%,transparent);} .dp-hero .dp-wrap{position:relative;} .dp-hero h1{font-family:'Syne',sans-serif;font-size:clamp(30px,4.4vw,52px);font-weight:700;line-height:1.14;letter-spacing:-1px;max-width:900px;animation:fadeUp 0.6s ease both;} .dp-hero h1 .dp-you{display:block;color:var(--accent);margin-top:10px;} .dp-hero-sub{font-family:'Syne',sans-serif;font-size:clamp(16px,1.4vw,19px);font-weight:600;letter-spacing:-0.1px;margin-top:28px;max-width:600px;animation:fadeUp 0.6s 0.1s ease both;} .dp-hero-text{font-size:15.5px;color:var(--muted);line-height:1.75;max-width:600px;margin-top:14px;animation:fadeUp 0.6s 0.15s ease both;} .dp-hero .dp-actions{animation:fadeUp 0.6s 0.2s ease both;} /* ─── 2 · OUTILS ─── */ .dp-cols{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:stretch;gap:0;margin-top:52px;} .dp-col{background:var(--card);border:1px solid var(--border);border-radius:20px;padding:30px 28px;} .dp-col-num{font-family:'Syne',sans-serif;font-size:11px;font-weight:700;letter-spacing:0.14em;color:var(--muted);margin-bottom:10px;} .dp-col-title{font-family:'Syne',sans-serif;font-size:15.5px;font-weight:700;letter-spacing:-0.1px;margin-bottom:18px;line-height:1.3;} .dp-col ul{list-style:none;display:flex;flex-direction:column;gap:12px;} .dp-col li{position:relative;padding-left:18px;font-size:13.5px;line-height:1.55;color:var(--muted);} .dp-col li::before{content:'';position:absolute;left:0;top:9px;width:6px;height:6px;border-radius:50%;background:rgba(16,28,44,0.25);} .dp-col li strong{color:var(--white);font-weight:500;} .dp-col.is-agents{background:var(--accent);border-color:var(--accent);color:#fff;} .dp-col.is-agents .dp-col-num{color:rgba(255,255,255,0.7);} .dp-col.is-agents li{color:rgba(255,255,255,0.92);} .dp-col.is-agents li::before{background:#fff;} .dp-col.is-yours{background:var(--navy);border-color:var(--navy);color:var(--cream-light);} .dp-col.is-yours .dp-col-num{color:rgba(246,243,236,0.6);} .dp-col.is-yours li{color:rgba(246,243,236,0.88);} .dp-col.is-yours li::before{background:var(--cream-light);} .dp-col-arrow{display:flex;align-items:center;justify-content:center;width:44px;color:var(--muted);font-size:20px;} /* Encart optionnel sous les colonnes (ex. immobilier : « Vous travaillez encore sur papier ? ») */ .dp-callout{margin-top:22px;display:grid;grid-template-columns:auto minmax(200px,300px) 1fr;gap:18px 28px;align-items:center;background:var(--cream);border:1.5px dashed rgba(16,28,44,0.28);border-radius:20px;padding:28px 32px;} .dp-callout-icon{width:52px;height:52px;border-radius:14px;background:var(--card);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--accent);} .dp-callout-title{font-family:'Syne',sans-serif;font-weight:700;font-size:17.5px;letter-spacing:-0.2px;line-height:1.25;} .dp-callout p{font-size:14px;color:var(--white);line-height:1.68;} .dp-note{margin-top:22px;font-size:14px;color:var(--muted);display:flex;align-items:center;gap:10px;} .dp-note::before{content:'';width:18px;height:1px;background:var(--accent);flex-shrink:0;} /* Encadré « ce qui reste chez vous » sur fond clair (ex. PME, bloc 2) — variante claire de .dp-privacy-keep */ .dp-keep{margin-top:32px;border:1px solid rgba(31,122,77,0.25);background:rgba(31,122,77,0.05);border-radius:18px;padding:20px 26px;font-size:14px;line-height:1.68;color:var(--white);} .dp-keep strong{font-family:'Syne',sans-serif;font-weight:700;color:var(--accent);} /* Cartes d'options côte à côte, sans flèches (ex. PME, bloc 2 : « Où que vous en soyez ») */ .dp-optioncards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:52px;} .dp-optioncard{background:var(--card);border:1px solid var(--border);border-radius:20px;padding:30px 28px;} .dp-optioncard-num{font-family:'Syne',sans-serif;font-size:11px;font-weight:700;letter-spacing:0.14em;color:var(--accent);margin-bottom:10px;} .dp-optioncard-title{font-family:'Syne',sans-serif;font-size:15.5px;font-weight:700;letter-spacing:-0.1px;margin-bottom:10px;line-height:1.3;} .dp-optioncard p{font-size:13.5px;color:var(--muted);line-height:1.62;} /* Frise horizontale du cycle (ex. PME, bloc 3 : sept étapes, bloc central de la page) */ .dp-frise{margin-top:56px;} .dp-frise-track{display:grid;grid-template-columns:repeat(7,1fr);gap:0;position:relative;} .dp-frise-track::before{content:'';position:absolute;top:23px;left:7.14%;right:7.14%;height:1px;background:rgba(31,122,77,0.28);} .dp-frise-step{position:relative;padding:0 10px;text-align:center;} .dp-frise-num{width:46px;height:46px;border-radius:50%;background:var(--card);border:1.5px solid rgba(31,122,77,0.35);color:var(--accent);font-family:'Syne',sans-serif;font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;position:relative;z-index:1;} .dp-frise-agent{font-family:'Syne',sans-serif;font-size:11px;font-weight:700;letter-spacing:0.09em;text-transform:uppercase;color:var(--accent);margin-bottom:6px;} .dp-frise-title{font-family:'Syne',sans-serif;font-weight:600;font-size:13px;letter-spacing:0;margin-bottom:7px;line-height:1.3;} .dp-frise-text{font-size:12px;color:var(--muted);line-height:1.5;} .dp-frise-step.is-you .dp-frise-num{background:var(--navy);border-color:var(--navy);color:var(--cream-light);} .dp-frise-step.is-you .dp-frise-agent{color:var(--white);} .dp-frise-note{margin-top:40px;font-size:14px;color:var(--muted);line-height:1.7;display:flex;align-items:flex-start;gap:10px;max-width:720px;} .dp-frise-note::before{content:'';width:18px;height:1px;background:var(--accent);flex-shrink:0;margin-top:10px;} /* Chiffre mis en avant dans le hero (ex. PME : « 38 h/mois ») */ .dp-hero-stat{margin-top:36px;max-width:620px;animation:fadeUp 0.6s 0.22s ease both;} .dp-highlight-unit{font-size:18px;font-weight:600;margin-left:2px;} .dp-highlight-source{display:block;font-size:12px;color:var(--muted);margin-top:8px;} /* ─── 3 · AGENTS ─── */ .dp-agents-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:52px;} .dp-agent{background:var(--card);border:1px solid var(--border);border-radius:20px;display:flex;flex-direction:column;overflow:hidden;transition:transform 0.25s,box-shadow 0.25s;} .dp-agent:hover{transform:translateY(-3px);box-shadow:0 10px 36px rgba(16,28,44,0.07);} .dp-agent-body{padding:30px 30px 26px;flex:1;} .dp-agent-head{display:flex;align-items:center;gap:14px;margin-bottom:18px;} .dp-agent-mono{width:42px;height:42px;border-radius:11px;background:rgba(31,122,77,0.1);color:var(--accent);font-family:'Syne',sans-serif;font-weight:700;font-size:17px;display:flex;align-items:center;justify-content:center;flex-shrink:0;} .dp-agent-name{font-family:'Syne',sans-serif;font-weight:700;font-size:18.5px;letter-spacing:-0.1px;line-height:1.15;} .dp-agent-name .dp-verb{color:var(--accent);font-weight:600;} .dp-agent p{font-size:14px;color:var(--muted);line-height:1.68;} .dp-agent-gain{background:rgba(31,122,77,0.07);border-top:1px solid rgba(31,122,77,0.14);padding:14px 30px;font-size:13.5px;line-height:1.5;color:var(--white);} .dp-agent-gain strong{color:var(--accent);font-weight:600;} .dp-agent.is-custom{grid-column:1/-1;background:var(--navy);border-color:var(--navy);color:var(--cream-light);} .dp-agent.is-custom .dp-agent-body{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:32px;align-items:start;padding:36px;} .dp-agent.is-custom .dp-agent-head{margin-bottom:0;} .dp-agent.is-custom .dp-agent-mono{background:rgba(246,243,236,0.1);color:var(--cream-light);border:1px dashed rgba(246,243,236,0.35);} .dp-agent.is-custom .dp-agent-name .dp-verb{color:#7fd1a4;font-weight:600;} .dp-agent.is-custom p{color:rgba(246,243,236,0.82);} /* Onglets optionnels (ex. juridique : un onglet par métier, chacun avec ses 4 cartes) */ .dp-tabs-label{font-size:14px;color:var(--muted);margin:44px 0 12px;} .dp-tabs{display:inline-flex;gap:4px;padding:5px;background:var(--card);border:1px solid var(--border);border-radius:100px;} .dp-tab{font-family:'DM Sans',sans-serif;font-size:15px;font-weight:500;color:var(--muted);background:transparent;border:none;border-radius:100px;padding:11px 24px;cursor:pointer;transition:background 0.2s,color 0.2s;line-height:1.3;} .dp-tab:hover{color:var(--white);} .dp-tab[aria-selected="true"]{background:var(--navy);color:var(--cream-light);} .dp-tab:focus-visible{outline:2px solid var(--accent);outline-offset:2px;} .dp-tabpanel .dp-agents-grid{margin-top:24px;} .dp-tabpanel:not([hidden]){animation:fadeUp 0.35s ease both;} .dp-agent.is-custom.is-standalone{margin-top:18px;} /* ─── TABLEAUX (audit + tarifs) ─── */ .dp-table{width:100%;border-collapse:separate;border-spacing:0;background:var(--card);border:1px solid var(--border);border-radius:20px;overflow:hidden;font-size:14.5px;} .dp-table th,.dp-table td{padding:18px 22px;text-align:left;vertical-align:top;border-bottom:1px solid var(--border);line-height:1.55;} .dp-table tr:last-child th,.dp-table tr:last-child td{border-bottom:none;} .dp-table thead th{font-family:'Syne',sans-serif;font-size:13px;font-weight:700;letter-spacing:0.02em;background:rgba(16,28,44,0.03);white-space:nowrap;} .dp-table tbody th{font-weight:500;color:var(--white);width:26%;} .dp-table tbody td{color:var(--muted);} .dp-table.is-prices tbody td{font-family:'Syne',sans-serif;font-weight:600;font-size:15.5px;color:var(--white);white-space:nowrap;} .dp-table .is-free{color:var(--accent)!important;} /* ─── 4 · DÉMARRAGE ─── */ .dp-steps{list-style:none;margin-top:52px;display:flex;flex-direction:column;counter-reset:none;} .dp-step{display:grid;grid-template-columns:72px 1fr;gap:0 24px;position:relative;padding-bottom:34px;} .dp-step:last-child{padding-bottom:0;} .dp-step::before{content:'';position:absolute;left:23px;top:50px;bottom:4px;width:1px;background:rgba(31,122,77,0.25);} .dp-step:last-child::before{display:none;} .dp-step-num{width:48px;height:48px;border-radius:50%;border:1px solid rgba(31,122,77,0.3);background:var(--card);color:var(--accent);font-family:'Syne',sans-serif;font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center;} .dp-step-title{font-family:'Syne',sans-serif;font-size:16.5px;font-weight:600;letter-spacing:-0.1px;margin:10px 0 6px;} .dp-step p{font-size:14px;color:var(--muted);line-height:1.68;max-width:640px;} .dp-step.is-key .dp-step-num{background:var(--accent);color:#fff;border-color:var(--accent);} .dp-audit{margin-top:56px;} .dp-audit .section-label{margin-bottom:14px;} /* ─── 5 · TARIFS ─── */ .dp-pricing .dp-table{margin-top:48px;} .dp-highlight{margin-top:22px;display:flex;gap:26px;align-items:center;background:linear-gradient(140deg,rgba(31,122,77,0.12) 0%,rgba(31,122,77,0.04) 100%);border:1px solid rgba(31,122,77,0.3);border-radius:20px;padding:28px 32px;} .dp-highlight-big{font-family:'Syne',sans-serif;font-weight:700;font-size:34px;letter-spacing:-0.8px;color:var(--accent);line-height:1;flex-shrink:0;} .dp-highlight p{font-size:15.5px;line-height:1.7;color:var(--white);} .dp-highlight p strong{font-family:'Syne',sans-serif;font-weight:600;display:block;font-size:15.5px;margin-bottom:4px;} .dp-fineprint{margin-top:18px;font-size:13px;color:var(--muted);line-height:1.7;max-width:760px;} /* ─── 6 · CONFIDENTIALITÉ ─── */ .dp-privacy{background:var(--navy);color:var(--cream-light);border-top:none;} .dp-privacy .section-label{color:#7fd1a4;} .dp-privacy-grid{display:grid;grid-template-columns:0.9fr 1.1fr;gap:64px;align-items:start;} .dp-privacy .dp-h2{color:var(--cream-light);} .dp-privacy-list{list-style:none;display:flex;flex-direction:column;} .dp-privacy-list li{padding:16px 0 16px 34px;position:relative;font-size:14px;line-height:1.65;color:rgba(246,243,236,0.86);border-bottom:1px solid rgba(246,243,236,0.1);} .dp-privacy-list li:first-child{padding-top:4px;} .dp-privacy-list li:first-child::before{top:8px;} .dp-privacy-list li:last-child{border-bottom:none;} .dp-privacy-list li::before{content:'✓';position:absolute;left:0;top:22px;width:20px;height:20px;border-radius:50%;background:rgba(127,209,164,0.15);color:#7fd1a4;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;} .dp-privacy .dp-lead{color:rgba(246,243,236,0.78);font-size:15px;} /* Encadré optionnel sous la liste (ex. juridique : « Ce qui reste toujours chez vous ») */ .dp-privacy-keep{margin-top:40px;border:1px solid rgba(127,209,164,0.35);background:rgba(127,209,164,0.07);border-radius:18px;padding:22px 26px;font-size:14.5px;line-height:1.68;color:var(--cream-light);} .dp-privacy-keep strong{font-family:'Syne',sans-serif;font-weight:700;color:#7fd1a4;} /* Outils présentés en lignes par métier (variante de .dp-cols) */ .dp-toolrows{margin-top:44px;background:var(--card);border:1px solid var(--border);border-radius:20px;overflow:hidden;} .dp-toolrow{display:grid;grid-template-columns:240px 1fr;gap:8px 32px;padding:24px 30px;border-bottom:1px solid var(--border);align-items:baseline;} .dp-toolrow:last-child{border-bottom:none;} .dp-toolrow-who{font-family:'Syne',sans-serif;font-weight:600;font-size:15px;letter-spacing:-0.1px;} .dp-toolrow-what{font-size:14px;color:var(--muted);line-height:1.6;} /* ─── 7 · CONTACT ─── */ .dp-contact{text-align:center;} .dp-contact .dp-h2{margin:0 auto 18px;} .dp-contact .dp-lead{margin:0 auto;} .dp-contact .dp-actions{justify-content:center;} .dp-voice{margin:44px auto 0;width:fit-content;max-width:100%;display:flex;align-items:center;justify-content:center;gap:10px 14px;flex-wrap:wrap;padding:18px 24px;border:1px solid var(--border);border-radius:100px;background:var(--card);font-size:15px;color:var(--muted);} .dp-voice a{font-family:'Syne',sans-serif;font-weight:700;color:var(--accent);text-decoration:none;white-space:nowrap;border-bottom:2px solid rgba(31,122,77,0.3);} .dp-voice a:hover{border-color:var(--accent);} /* ─── FOOTER (identique aux autres pages) ─── */ footer{padding:56px 48px;border-top:1px solid var(--border);} .footer-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:40px;gap:40px;flex-wrap:wrap;} .footer-brand .footer-logo{font-family:'Syne',sans-serif;font-weight:800;font-size:22px;color:var(--white);margin-bottom:10px;} .footer-brand .footer-logo span{color:var(--accent);} .footer-brand p{font-size:13px;color:var(--muted);max-width:240px;line-height:1.6;} .footer-links-group h4{font-family:'Syne',sans-serif;font-size:13px;font-weight:600;color:var(--white);margin-bottom:14px;text-transform:uppercase;letter-spacing:0.08em;} .footer-links-group ul{list-style:none;display:flex;flex-direction:column;gap:10px;} .footer-links-group a{font-size:13px;color:var(--muted);text-decoration:none;} .footer-links-group a:hover{color:var(--white);} .footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:28px;border-top:1px solid var(--border);flex-wrap:wrap;gap:16px;} .footer-bottom p{font-size:12px;color:var(--muted);} .footer-rgpd{display:flex;gap:6px;align-items:center;flex-wrap:wrap;} .rgpd-badge{padding:4px 10px;background:rgba(31,122,77,0.07);border:1px solid rgba(31,122,77,0.15);border-radius:100px;font-size:11px;color:var(--accent);} @keyframes fadeUp{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}} @media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;}html{scroll-behavior:auto;}} /* ─── MOTION DESIGN : révélation au scroll ─── */ .reveal{opacity:0;transform:translateY(22px);transition:opacity 0.7s cubic-bezier(.16,.8,.3,1),transform 0.7s cubic-bezier(.16,.8,.3,1);} .reveal.is-visible{opacity:1;transform:translateY(0);} .reveal-stagger > *{opacity:0;transform:translateY(22px);transition:opacity 0.6s cubic-bezier(.16,.8,.3,1),transform 0.6s cubic-bezier(.16,.8,.3,1);} .reveal-stagger.is-visible > *{opacity:1;transform:translateY(0);} .reveal-stagger.is-visible > *:nth-child(1){transition-delay:0s;} .reveal-stagger.is-visible > *:nth-child(2){transition-delay:0.08s;} .reveal-stagger.is-visible > *:nth-child(3){transition-delay:0.16s;} .reveal-stagger.is-visible > *:nth-child(4){transition-delay:0.24s;} .reveal-stagger.is-visible > *:nth-child(5){transition-delay:0.32s;} .reveal-stagger.is-visible > *:nth-child(6){transition-delay:0.4s;} .reveal-stagger.is-visible > *:nth-child(7){transition-delay:0.48s;} /* Micro-interactions */ .btn-primary,.btn-ghost{transition:transform 0.15s cubic-bezier(.34,1.56,.64,1),box-shadow 0.2s,border-color 0.2s,background 0.2s,color 0.2s;} .btn-primary:active,.btn-ghost:active{transform:scale(0.96);} .dp-optioncard{transition:transform 0.35s cubic-bezier(.16,.8,.3,1),box-shadow 0.35s;} .dp-optioncard:hover{transform:translateY(-3px);box-shadow:0 10px 30px rgba(16,28,44,0.06);} .dp-frise-num{transition:transform 0.3s cubic-bezier(.34,1.56,.64,1),box-shadow 0.3s;} .dp-frise-step:hover .dp-frise-num{transform:scale(1.12);box-shadow:0 6px 18px rgba(31,122,77,0.25);} .nav-links a{position:relative;} .nav-links a:not(.nav-cta)::after{content:'';position:absolute;left:0;right:0;bottom:-4px;height:1.5px;background:var(--accent);transform:scaleX(0);transform-origin:right;transition:transform 0.25s ease;} .nav-links a:not(.nav-cta):hover::after{transform:scaleX(1);transform-origin:left;} /* Barre de progression de lecture (pages articles longues) */ .reading-progress{position:fixed;top:0;left:0;height:3px;background:var(--accent);z-index:300;width:0%;} @media(prefers-reduced-motion:reduce){ .reveal,.reveal-stagger>*{opacity:1!important;transform:none!important;transition:none!important;} } /* ─── RESPONSIVE ─── */ @media(max-width:960px){ nav{padding:16px 24px;} nav.nav-scrolled{padding:10px 24px;} .nav-links{display:none;} .nav-burger{display:flex;} .dp-cols{grid-template-columns:1fr;gap:0;} .dp-col-arrow{width:auto;height:40px;transform:rotate(90deg);} .dp-privacy-grid{grid-template-columns:1fr;gap:28px;} .dp-agent.is-custom .dp-agent-body{grid-template-columns:1fr;gap:18px;} .dp-optioncards{grid-template-columns:1fr;} .dp-frise-track{display:flex;flex-direction:column;} .dp-frise-track::before{display:none;} .dp-frise-step{display:grid;grid-template-columns:46px 1fr;gap:0 18px;text-align:left;padding-bottom:28px;position:relative;} .dp-frise-step::after{content:'';position:absolute;left:22px;top:46px;bottom:4px;width:1px;background:rgba(31,122,77,0.28);} .dp-frise-step:last-child{padding-bottom:0;} .dp-frise-step:last-child::after{display:none;} .dp-frise-num{grid-column:1;grid-row:1/span 3;align-self:start;margin:0;} .dp-frise-agent,.dp-frise-title,.dp-frise-text{grid-column:2;} } @media(max-width:720px){ .dp-hero{padding:120px 16px 72px;} .dp-hero h1{letter-spacing:-1px;} .dp-section{padding:72px 16px;} footer{padding:48px 16px;} .footer-top{flex-direction:column;} .dp-actions{flex-direction:column;align-items:stretch;} .dp-actions a{text-align:center;} .dp-agents-grid{grid-template-columns:1fr;} .dp-agent-body{padding:24px 22px 20px;} .dp-agent-gain{padding:14px 22px;} .dp-agent.is-custom .dp-agent-body{padding:26px 22px;} .dp-col{padding:24px 22px;} .dp-optioncard{padding:24px 22px;} .dp-keep{padding:20px 22px;} .dp-callout{grid-template-columns:1fr;padding:24px 22px;gap:14px;} .dp-tabs{display:grid;grid-template-columns:repeat(3,1fr);width:100%;border-radius:16px;} .dp-tab{border-radius:12px;padding:10px 6px;font-size:13.5px;} .dp-toolrow{grid-template-columns:1fr;padding:20px 22px;} .dp-privacy-keep{padding:20px 22px;} .dp-step{grid-template-columns:48px 1fr;gap:0 16px;} .dp-highlight{flex-direction:column;align-items:flex-start;gap:12px;padding:24px 22px;} .dp-voice{border-radius:18px;flex-direction:column;} /* Tableaux empilés : une carte par ligne, chaque cellule garde son en-tête */ .dp-table,.dp-table tbody,.dp-table tr,.dp-table th,.dp-table td{display:block;width:100%;} .dp-table{background:transparent;border:none;border-radius:0;} .dp-table thead{display:none;} .dp-table tbody tr{background:var(--card);border:1px solid var(--border);border-radius:16px;margin-bottom:12px;overflow:hidden;} .dp-table tbody th{width:100%;font-family:'Syne',sans-serif;font-weight:700;font-size:15px;padding:16px 18px 12px;border-bottom:1px solid var(--border);background:rgba(16,28,44,0.03);} .dp-table tbody td{display:flex;justify-content:space-between;gap:16px;padding:12px 18px;white-space:normal!important;} .dp-table tbody td::before{content:attr(data-label);font-family:'DM Sans',sans-serif;font-size:13px;font-weight:500;color:var(--muted);flex-shrink:0;min-width:84px;} .dp-table tbody td > span{text-align:right;} .dp-table tr:last-child th{border-bottom:1px solid var(--border);} .dp-table tbody td:last-child{border-bottom:none;} }