/* Theme Name: LDLA Dental Theme URI: https://ldla-dental.fr Author: Broxima Author URI: https://broxima.fr Description: Thème bloc sur mesure de LDLA Dental / CIL Dental. Contenu 100 % éditable dans Gutenberg. Version: 1.0.0 Requires at least: 6.6 Requires PHP: 8.0 License: GPL-2.0-or-later License URI: https://www.gnu.org/licenses/gpl-2.0.html Text Domain: ldla-dental Tags: block-theme, full-site-editing, business */ :root{--mesh-hero:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 250'%3E%3Cpath d='M40.0 30.0L80.0 14.0M80.0 14.0L120.0 22.0M120.0 22.0L160.0 12.0M160.0 12.0L186.0 40.0M186.0 40.0L192.0 90.0M192.0 90.0L178.0 140.0M178.0 140.0L166.0 200.0M166.0 200.0L150.0 236.0M150.0 236.0L132.0 204.0M132.0 204.0L116.0 152.0M116.0 152.0L100.0 146.0M100.0 146.0L84.0 152.0M84.0 152.0L70.0 204.0M70.0 204.0L52.0 236.0M52.0 236.0L36.0 196.0M36.0 196.0L24.0 140.0M24.0 140.0L10.0 90.0M10.0 90.0L16.0 44.0M16.0 44.0L40.0 30.0M55.0 56.5L40.0 30.0M55.0 56.5L16.0 44.0M55.0 56.5L45.0 97.5M55.0 56.5L96.7 46.3M55.0 56.5L80.0 14.0M96.7 46.3L120.0 22.0M96.7 46.3L80.0 14.0M96.7 46.3L143.4 56.2M96.7 46.3L89.5 100.3M143.4 56.2L120.0 22.0M143.4 56.2L145.1 100.8M143.4 56.2L186.0 40.0M143.4 56.2L160.0 12.0M45.0 97.5L10.0 90.0M45.0 97.5L77.9 122.5M45.0 97.5L89.5 100.3M45.0 97.5L24.0 140.0M89.5 100.3L77.9 122.5M89.5 100.3L119.2 127.2M89.5 100.3L100.0 146.0M89.5 100.3L84.0 152.0M145.1 100.8L119.2 127.2M145.1 100.8L192.0 90.0M145.1 100.8L178.0 140.0M145.1 100.8L153.1 155.8M77.9 122.5L84.0 152.0M77.9 122.5L100.0 146.0M77.9 122.5L119.2 127.2M119.2 127.2L116.0 152.0M119.2 127.2L100.0 146.0M37.2 153.3L24.0 140.0M37.2 153.3L56.5 189.8M37.2 153.3L36.0 196.0M37.2 153.3L84.0 152.0M37.2 153.3L77.9 122.5M153.1 155.8L178.0 140.0M153.1 155.8L116.0 152.0M153.1 155.8L119.2 127.2M153.1 155.8L166.0 200.0M153.1 155.8L149.7 202.1M56.5 189.8L70.0 204.0M56.5 189.8L36.0 196.0M56.5 189.8L52.0 236.0M56.5 189.8L84.0 152.0M149.7 202.1L166.0 200.0M149.7 202.1L132.0 204.0M149.7 202.1L150.0 236.0M149.7 202.1L116.0 152.0' fill='none' stroke='%230a0c0f' stroke-width='0.9'/%3E%3Cg fill='%230a0c0f'%3E%3Ccircle cx='40.0' cy='30.0' r='1.8'/%3E%3Ccircle cx='80.0' cy='14.0' r='1.8'/%3E%3Ccircle cx='120.0' cy='22.0' r='1.8'/%3E%3Ccircle cx='160.0' cy='12.0' r='1.8'/%3E%3Ccircle cx='186.0' cy='40.0' r='1.8'/%3E%3Ccircle cx='192.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='178.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='166.0' cy='200.0' r='1.8'/%3E%3Ccircle cx='150.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='132.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='116.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='100.0' cy='146.0' r='1.8'/%3E%3Ccircle cx='84.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='70.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='52.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='36.0' cy='196.0' r='1.8'/%3E%3Ccircle cx='24.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='10.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='16.0' cy='44.0' r='1.8'/%3E%3Ccircle cx='55.0' cy='56.5' r='1.8'/%3E%3Ccircle cx='96.7' cy='46.3' r='1.8'/%3E%3Ccircle cx='143.4' cy='56.2' r='1.8'/%3E%3Ccircle cx='45.0' cy='97.5' r='1.8'/%3E%3Ccircle cx='89.5' cy='100.3' r='1.8'/%3E%3Ccircle cx='145.1' cy='100.8' r='1.8'/%3E%3Ccircle cx='77.9' cy='122.5' r='1.8'/%3E%3Ccircle cx='119.2' cy='127.2' r='1.8'/%3E%3Ccircle cx='37.2' cy='153.3' r='1.8'/%3E%3Ccircle cx='153.1' cy='155.8' r='1.8'/%3E%3Ccircle cx='56.5' cy='189.8' r='1.8'/%3E%3Ccircle cx='149.7' cy='202.1' r='1.8'/%3E%3C/g%3E%3C/svg%3E");--mesh-solid:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 250'%3E%3Cpath d='M40.0 30.0L80.0 14.0M80.0 14.0L120.0 22.0M120.0 22.0L160.0 12.0M160.0 12.0L186.0 40.0M186.0 40.0L192.0 90.0M192.0 90.0L178.0 140.0M178.0 140.0L166.0 200.0M166.0 200.0L150.0 236.0M150.0 236.0L132.0 204.0M132.0 204.0L116.0 152.0M116.0 152.0L100.0 146.0M100.0 146.0L84.0 152.0M84.0 152.0L70.0 204.0M70.0 204.0L52.0 236.0M52.0 236.0L36.0 196.0M36.0 196.0L24.0 140.0M24.0 140.0L10.0 90.0M10.0 90.0L16.0 44.0M16.0 44.0L40.0 30.0M55.0 57.3L40.0 30.0M55.0 57.3L16.0 44.0M55.0 57.3L97.4 41.6M55.0 57.3L50.2 103.5M55.0 57.3L80.0 14.0M97.4 41.6L120.0 22.0M97.4 41.6L80.0 14.0M97.4 41.6L147.0 52.7M97.4 41.6L95.6 92.9M147.0 52.7L120.0 22.0M147.0 52.7L186.0 40.0M147.0 52.7L160.0 12.0M147.0 52.7L146.1 103.0M50.2 103.5L73.0 126.3M50.2 103.5L10.0 90.0M50.2 103.5L24.0 140.0M50.2 103.5L95.6 92.9M95.6 92.9L73.0 126.3M95.6 92.9L125.2 130.6M95.6 92.9L146.1 103.0M146.1 103.0L125.2 130.6M146.1 103.0L192.0 90.0M146.1 103.0L178.0 140.0M73.0 126.3L84.0 152.0M73.0 126.3L100.0 146.0M73.0 126.3L42.4 154.2M125.2 130.6L116.0 152.0M125.2 130.6L100.0 146.0M125.2 130.6L154.0 163.3M125.2 130.6L84.0 152.0M42.4 154.2L24.0 140.0M42.4 154.2L84.0 152.0M42.4 154.2L36.0 196.0M42.4 154.2L61.3 196.8M154.0 163.3L145.7 194.3M154.0 163.3L178.0 140.0M154.0 163.3L166.0 200.0M154.0 163.3L116.0 152.0M61.3 196.8L70.0 204.0M61.3 196.8L36.0 196.0M61.3 196.8L52.0 236.0M61.3 196.8L84.0 152.0M145.7 194.3L132.0 204.0M145.7 194.3L166.0 200.0M145.7 194.3L150.0 236.0M145.7 194.3L116.0 152.0' fill='none' stroke='%23ffffff' stroke-width='0.9'/%3E%3Cg fill='%23ffffff'%3E%3Ccircle cx='40.0' cy='30.0' r='1.8'/%3E%3Ccircle cx='80.0' cy='14.0' r='1.8'/%3E%3Ccircle cx='120.0' cy='22.0' r='1.8'/%3E%3Ccircle cx='160.0' cy='12.0' r='1.8'/%3E%3Ccircle cx='186.0' cy='40.0' r='1.8'/%3E%3Ccircle cx='192.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='178.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='166.0' cy='200.0' r='1.8'/%3E%3Ccircle cx='150.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='132.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='116.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='100.0' cy='146.0' r='1.8'/%3E%3Ccircle cx='84.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='70.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='52.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='36.0' cy='196.0' r='1.8'/%3E%3Ccircle cx='24.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='10.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='16.0' cy='44.0' r='1.8'/%3E%3Ccircle cx='55.0' cy='57.3' r='1.8'/%3E%3Ccircle cx='97.4' cy='41.6' r='1.8'/%3E%3Ccircle cx='147.0' cy='52.7' r='1.8'/%3E%3Ccircle cx='50.2' cy='103.5' r='1.8'/%3E%3Ccircle cx='95.6' cy='92.9' r='1.8'/%3E%3Ccircle cx='146.1' cy='103.0' r='1.8'/%3E%3Ccircle cx='73.0' cy='126.3' r='1.8'/%3E%3Ccircle cx='125.2' cy='130.6' r='1.8'/%3E%3Ccircle cx='42.4' cy='154.2' r='1.8'/%3E%3Ccircle cx='154.0' cy='163.3' r='1.8'/%3E%3Ccircle cx='61.3' cy='196.8' r='1.8'/%3E%3Ccircle cx='145.7' cy='194.3' r='1.8'/%3E%3C/g%3E%3C/svg%3E");--mesh-wire:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 250'%3E%3Cpath d='M40.0 30.0L80.0 14.0M80.0 14.0L120.0 22.0M120.0 22.0L160.0 12.0M160.0 12.0L186.0 40.0M186.0 40.0L192.0 90.0M192.0 90.0L178.0 140.0M178.0 140.0L166.0 200.0M166.0 200.0L150.0 236.0M150.0 236.0L132.0 204.0M132.0 204.0L116.0 152.0M116.0 152.0L100.0 146.0M100.0 146.0L84.0 152.0M84.0 152.0L70.0 204.0M70.0 204.0L52.0 236.0M52.0 236.0L36.0 196.0M36.0 196.0L24.0 140.0M24.0 140.0L10.0 90.0M10.0 90.0L16.0 44.0M16.0 44.0L40.0 30.0M55.0 60.2L40.0 30.0M55.0 60.2L16.0 44.0M55.0 60.2L46.3 102.5M55.0 60.2L103.9 45.1M55.0 60.2L80.0 14.0M103.9 45.1L120.0 22.0M103.9 45.1L80.0 14.0M103.9 45.1L144.3 48.3M103.9 45.1L94.6 98.4M144.3 48.3L120.0 22.0M144.3 48.3L160.0 12.0M144.3 48.3L186.0 40.0M144.3 48.3L155.8 101.4M46.3 102.5L73.2 123.4M46.3 102.5L10.0 90.0M46.3 102.5L24.0 140.0M46.3 102.5L94.6 98.4M94.6 98.4L73.2 123.4M94.6 98.4L120.7 128.1M94.6 98.4L100.0 146.0M155.8 101.4L192.0 90.0M155.8 101.4L120.7 128.1M155.8 101.4L178.0 140.0M155.8 101.4L163.8 157.7M73.2 123.4L84.0 152.0M73.2 123.4L100.0 146.0M73.2 123.4L42.0 153.5M120.7 128.1L116.0 152.0M120.7 128.1L100.0 146.0M120.7 128.1L84.0 152.0M42.0 153.5L24.0 140.0M42.0 153.5L84.0 152.0M42.0 153.5L36.0 196.0M42.0 153.5L54.2 195.1M163.8 157.7L178.0 140.0M163.8 157.7L166.0 200.0M163.8 157.7L152.2 200.1M163.8 157.7L116.0 152.0M163.8 157.7L120.7 128.1M54.2 195.1L70.0 204.0M54.2 195.1L36.0 196.0M54.2 195.1L52.0 236.0M54.2 195.1L84.0 152.0M152.2 200.1L166.0 200.0M152.2 200.1L132.0 204.0M152.2 200.1L150.0 236.0M152.2 200.1L116.0 152.0' fill='none' stroke='%230f79bd' stroke-width='0.9'/%3E%3Cg fill='%230f79bd'%3E%3Ccircle cx='40.0' cy='30.0' r='1.8'/%3E%3Ccircle cx='80.0' cy='14.0' r='1.8'/%3E%3Ccircle cx='120.0' cy='22.0' r='1.8'/%3E%3Ccircle cx='160.0' cy='12.0' r='1.8'/%3E%3Ccircle cx='186.0' cy='40.0' r='1.8'/%3E%3Ccircle cx='192.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='178.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='166.0' cy='200.0' r='1.8'/%3E%3Ccircle cx='150.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='132.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='116.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='100.0' cy='146.0' r='1.8'/%3E%3Ccircle cx='84.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='70.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='52.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='36.0' cy='196.0' r='1.8'/%3E%3Ccircle cx='24.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='10.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='16.0' cy='44.0' r='1.8'/%3E%3Ccircle cx='55.0' cy='60.2' r='1.8'/%3E%3Ccircle cx='103.9' cy='45.1' r='1.8'/%3E%3Ccircle cx='144.3' cy='48.3' r='1.8'/%3E%3Ccircle cx='46.3' cy='102.5' r='1.8'/%3E%3Ccircle cx='94.6' cy='98.4' r='1.8'/%3E%3Ccircle cx='155.8' cy='101.4' r='1.8'/%3E%3Ccircle cx='73.2' cy='123.4' r='1.8'/%3E%3Ccircle cx='120.7' cy='128.1' r='1.8'/%3E%3Ccircle cx='42.0' cy='153.5' r='1.8'/%3E%3Ccircle cx='163.8' cy='157.7' r='1.8'/%3E%3Ccircle cx='54.2' cy='195.1' r='1.8'/%3E%3Ccircle cx='152.2' cy='200.1' r='1.8'/%3E%3C/g%3E%3C/svg%3E");--mesh-final:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 250'%3E%3Cpath d='M40.0 30.0L80.0 14.0M80.0 14.0L120.0 22.0M120.0 22.0L160.0 12.0M160.0 12.0L186.0 40.0M186.0 40.0L192.0 90.0M192.0 90.0L178.0 140.0M178.0 140.0L166.0 200.0M166.0 200.0L150.0 236.0M150.0 236.0L132.0 204.0M132.0 204.0L116.0 152.0M116.0 152.0L100.0 146.0M100.0 146.0L84.0 152.0M84.0 152.0L70.0 204.0M70.0 204.0L52.0 236.0M52.0 236.0L36.0 196.0M36.0 196.0L24.0 140.0M24.0 140.0L10.0 90.0M10.0 90.0L16.0 44.0M16.0 44.0L40.0 30.0M55.0 63.9L40.0 30.0M55.0 63.9L16.0 44.0M55.0 63.9L47.6 107.5M55.0 63.9L97.0 43.9M55.0 63.9L10.0 90.0M97.0 43.9L120.0 22.0M97.0 43.9L80.0 14.0M97.0 43.9L145.2 54.5M97.0 43.9L99.6 96.6M145.2 54.5L120.0 22.0M145.2 54.5L186.0 40.0M145.2 54.5L160.0 12.0M145.2 54.5L152.6 101.9M47.6 107.5L82.4 124.4M47.6 107.5L24.0 140.0M47.6 107.5L10.0 90.0M47.6 107.5L46.8 153.8M99.6 96.6L82.4 124.4M99.6 96.6L122.2 128.9M99.6 96.6L100.0 146.0M99.6 96.6L47.6 107.5M152.6 101.9L122.2 128.9M152.6 101.9L192.0 90.0M152.6 101.9L178.0 140.0M152.6 101.9L99.6 96.6M82.4 124.4L84.0 152.0M82.4 124.4L100.0 146.0M82.4 124.4L122.2 128.9M122.2 128.9L116.0 152.0M122.2 128.9L100.0 146.0M46.8 153.8L24.0 140.0M46.8 153.8L84.0 152.0M46.8 153.8L36.0 196.0M46.8 153.8L82.4 124.4M160.6 159.6L178.0 140.0M160.6 159.6L166.0 200.0M160.6 159.6L140.7 198.2M160.6 159.6L116.0 152.0M160.6 159.6L122.2 128.9M65.9 200.3L70.0 204.0M65.9 200.3L36.0 196.0M65.9 200.3L52.0 236.0M65.9 200.3L46.8 153.8M65.9 200.3L84.0 152.0M140.7 198.2L132.0 204.0M140.7 198.2L166.0 200.0M140.7 198.2L150.0 236.0M140.7 198.2L116.0 152.0' fill='none' stroke='%23ffffff' stroke-width='0.9'/%3E%3Cg fill='%23ffffff'%3E%3Ccircle cx='40.0' cy='30.0' r='1.8'/%3E%3Ccircle cx='80.0' cy='14.0' r='1.8'/%3E%3Ccircle cx='120.0' cy='22.0' r='1.8'/%3E%3Ccircle cx='160.0' cy='12.0' r='1.8'/%3E%3Ccircle cx='186.0' cy='40.0' r='1.8'/%3E%3Ccircle cx='192.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='178.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='166.0' cy='200.0' r='1.8'/%3E%3Ccircle cx='150.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='132.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='116.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='100.0' cy='146.0' r='1.8'/%3E%3Ccircle cx='84.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='70.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='52.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='36.0' cy='196.0' r='1.8'/%3E%3Ccircle cx='24.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='10.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='16.0' cy='44.0' r='1.8'/%3E%3Ccircle cx='55.0' cy='63.9' r='1.8'/%3E%3Ccircle cx='97.0' cy='43.9' r='1.8'/%3E%3Ccircle cx='145.2' cy='54.5' r='1.8'/%3E%3Ccircle cx='47.6' cy='107.5' r='1.8'/%3E%3Ccircle cx='99.6' cy='96.6' r='1.8'/%3E%3Ccircle cx='152.6' cy='101.9' r='1.8'/%3E%3Ccircle cx='82.4' cy='124.4' r='1.8'/%3E%3Ccircle cx='122.2' cy='128.9' r='1.8'/%3E%3Ccircle cx='46.8' cy='153.8' r='1.8'/%3E%3Ccircle cx='160.6' cy='159.6' r='1.8'/%3E%3Ccircle cx='65.9' cy='200.3' r='1.8'/%3E%3Ccircle cx='140.7' cy='198.2' r='1.8'/%3E%3C/g%3E%3C/svg%3E");--mesh-a:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 250'%3E%3Cpath d='M40.0 30.0L80.0 14.0M80.0 14.0L120.0 22.0M120.0 22.0L160.0 12.0M160.0 12.0L186.0 40.0M186.0 40.0L192.0 90.0M192.0 90.0L178.0 140.0M178.0 140.0L166.0 200.0M166.0 200.0L150.0 236.0M150.0 236.0L132.0 204.0M132.0 204.0L116.0 152.0M116.0 152.0L100.0 146.0M100.0 146.0L84.0 152.0M84.0 152.0L70.0 204.0M70.0 204.0L52.0 236.0M52.0 236.0L36.0 196.0M36.0 196.0L24.0 140.0M24.0 140.0L10.0 90.0M10.0 90.0L16.0 44.0M16.0 44.0L40.0 30.0M55.0 61.7L40.0 30.0M55.0 61.7L56.8 100.6M55.0 61.7L16.0 44.0M55.0 61.7L105.1 49.8M55.0 61.7L92.7 97.8M105.1 49.8L120.0 22.0M105.1 49.8L137.6 55.4M105.1 49.8L80.0 14.0M105.1 49.8L92.7 97.8M137.6 55.4L120.0 22.0M137.6 55.4L160.0 12.0M137.6 55.4L143.7 105.7M137.6 55.4L186.0 40.0M56.8 100.6L92.7 97.8M56.8 100.6L77.3 131.2M56.8 100.6L10.0 90.0M56.8 100.6L24.0 140.0M92.7 97.8L118.7 120.7M92.7 97.8L77.3 131.2M92.7 97.8L100.0 146.0M143.7 105.7L118.7 120.7M143.7 105.7L178.0 140.0M143.7 105.7L192.0 90.0M143.7 105.7L92.7 97.8M77.3 131.2L84.0 152.0M77.3 131.2L100.0 146.0M77.3 131.2L118.7 120.7M118.7 120.7L116.0 152.0M118.7 120.7L100.0 146.0M38.3 155.3L24.0 140.0M38.3 155.3L36.0 196.0M38.3 155.3L84.0 152.0M38.3 155.3L77.3 131.2M38.3 155.3L63.7 194.9M151.7 158.7L178.0 140.0M151.7 158.7L116.0 152.0M151.7 158.7L144.2 198.5M151.7 158.7L166.0 200.0M151.7 158.7L132.0 204.0M63.7 194.9L70.0 204.0M63.7 194.9L36.0 196.0M63.7 194.9L52.0 236.0M63.7 194.9L84.0 152.0M144.2 198.5L132.0 204.0M144.2 198.5L166.0 200.0M144.2 198.5L150.0 236.0M144.2 198.5L116.0 152.0' fill='none' stroke='%230f79bd' stroke-width='0.9'/%3E%3Cg fill='%230f79bd'%3E%3Ccircle cx='40.0' cy='30.0' r='1.8'/%3E%3Ccircle cx='80.0' cy='14.0' r='1.8'/%3E%3Ccircle cx='120.0' cy='22.0' r='1.8'/%3E%3Ccircle cx='160.0' cy='12.0' r='1.8'/%3E%3Ccircle cx='186.0' cy='40.0' r='1.8'/%3E%3Ccircle cx='192.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='178.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='166.0' cy='200.0' r='1.8'/%3E%3Ccircle cx='150.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='132.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='116.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='100.0' cy='146.0' r='1.8'/%3E%3Ccircle cx='84.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='70.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='52.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='36.0' cy='196.0' r='1.8'/%3E%3Ccircle cx='24.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='10.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='16.0' cy='44.0' r='1.8'/%3E%3Ccircle cx='55.0' cy='61.7' r='1.8'/%3E%3Ccircle cx='105.1' cy='49.8' r='1.8'/%3E%3Ccircle cx='137.6' cy='55.4' r='1.8'/%3E%3Ccircle cx='56.8' cy='100.6' r='1.8'/%3E%3Ccircle cx='92.7' cy='97.8' r='1.8'/%3E%3Ccircle cx='143.7' cy='105.7' r='1.8'/%3E%3Ccircle cx='77.3' cy='131.2' r='1.8'/%3E%3Ccircle cx='118.7' cy='120.7' r='1.8'/%3E%3Ccircle cx='38.3' cy='155.3' r='1.8'/%3E%3Ccircle cx='151.7' cy='158.7' r='1.8'/%3E%3Ccircle cx='63.7' cy='194.9' r='1.8'/%3E%3Ccircle cx='144.2' cy='198.5' r='1.8'/%3E%3C/g%3E%3C/svg%3E");--mesh-b:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 250'%3E%3Cpath d='M40.0 30.0L80.0 14.0M80.0 14.0L120.0 22.0M120.0 22.0L160.0 12.0M160.0 12.0L186.0 40.0M186.0 40.0L192.0 90.0M192.0 90.0L178.0 140.0M178.0 140.0L166.0 200.0M166.0 200.0L150.0 236.0M150.0 236.0L132.0 204.0M132.0 204.0L116.0 152.0M116.0 152.0L100.0 146.0M100.0 146.0L84.0 152.0M84.0 152.0L70.0 204.0M70.0 204.0L52.0 236.0M52.0 236.0L36.0 196.0M36.0 196.0L24.0 140.0M24.0 140.0L10.0 90.0M10.0 90.0L16.0 44.0M16.0 44.0L40.0 30.0M55.0 52.1L40.0 30.0M55.0 52.1L16.0 44.0M55.0 52.1L98.9 44.1M55.0 52.1L80.0 14.0M55.0 52.1L49.4 97.6M98.9 44.1L120.0 22.0M98.9 44.1L80.0 14.0M98.9 44.1L142.2 58.0M98.9 44.1L89.8 102.7M142.2 58.0L155.4 94.4M142.2 58.0L120.0 22.0M142.2 58.0L186.0 40.0M142.2 58.0L160.0 12.0M49.4 97.6L10.0 90.0M49.4 97.6L81.6 122.0M49.4 97.6L89.8 102.7M49.4 97.6L24.0 140.0M89.8 102.7L81.6 122.0M89.8 102.7L126.2 124.9M89.8 102.7L100.0 146.0M89.8 102.7L84.0 152.0M155.4 94.4L192.0 90.0M155.4 94.4L126.2 124.9M155.4 94.4L178.0 140.0M155.4 94.4L163.4 154.0M81.6 122.0L84.0 152.0M81.6 122.0L100.0 146.0M81.6 122.0L126.2 124.9M126.2 124.9L116.0 152.0M126.2 124.9L100.0 146.0M48.3 156.3L24.0 140.0M48.3 156.3L84.0 152.0M48.3 156.3L66.2 193.1M48.3 156.3L36.0 196.0M48.3 156.3L81.6 122.0M163.4 154.0L178.0 140.0M163.4 154.0L166.0 200.0M163.4 154.0L126.2 124.9M163.4 154.0L116.0 152.0M163.4 154.0L142.6 202.8M66.2 193.1L70.0 204.0M66.2 193.1L36.0 196.0M66.2 193.1L84.0 152.0M66.2 193.1L52.0 236.0M142.6 202.8L132.0 204.0M142.6 202.8L166.0 200.0M142.6 202.8L150.0 236.0M142.6 202.8L116.0 152.0' fill='none' stroke='%230f79bd' stroke-width='0.9'/%3E%3Cg fill='%230f79bd'%3E%3Ccircle cx='40.0' cy='30.0' r='1.8'/%3E%3Ccircle cx='80.0' cy='14.0' r='1.8'/%3E%3Ccircle cx='120.0' cy='22.0' r='1.8'/%3E%3Ccircle cx='160.0' cy='12.0' r='1.8'/%3E%3Ccircle cx='186.0' cy='40.0' r='1.8'/%3E%3Ccircle cx='192.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='178.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='166.0' cy='200.0' r='1.8'/%3E%3Ccircle cx='150.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='132.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='116.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='100.0' cy='146.0' r='1.8'/%3E%3Ccircle cx='84.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='70.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='52.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='36.0' cy='196.0' r='1.8'/%3E%3Ccircle cx='24.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='10.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='16.0' cy='44.0' r='1.8'/%3E%3Ccircle cx='55.0' cy='52.1' r='1.8'/%3E%3Ccircle cx='98.9' cy='44.1' r='1.8'/%3E%3Ccircle cx='142.2' cy='58.0' r='1.8'/%3E%3Ccircle cx='49.4' cy='97.6' r='1.8'/%3E%3Ccircle cx='89.8' cy='102.7' r='1.8'/%3E%3Ccircle cx='155.4' cy='94.4' r='1.8'/%3E%3Ccircle cx='81.6' cy='122.0' r='1.8'/%3E%3Ccircle cx='126.2' cy='124.9' r='1.8'/%3E%3Ccircle cx='48.3' cy='156.3' r='1.8'/%3E%3Ccircle cx='163.4' cy='154.0' r='1.8'/%3E%3Ccircle cx='66.2' cy='193.1' r='1.8'/%3E%3Ccircle cx='142.6' cy='202.8' r='1.8'/%3E%3C/g%3E%3C/svg%3E");--mesh-c:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 250'%3E%3Cpath d='M40.0 30.0L80.0 14.0M80.0 14.0L120.0 22.0M120.0 22.0L160.0 12.0M160.0 12.0L186.0 40.0M186.0 40.0L192.0 90.0M192.0 90.0L178.0 140.0M178.0 140.0L166.0 200.0M166.0 200.0L150.0 236.0M150.0 236.0L132.0 204.0M132.0 204.0L116.0 152.0M116.0 152.0L100.0 146.0M100.0 146.0L84.0 152.0M84.0 152.0L70.0 204.0M70.0 204.0L52.0 236.0M52.0 236.0L36.0 196.0M36.0 196.0L24.0 140.0M24.0 140.0L10.0 90.0M10.0 90.0L16.0 44.0M16.0 44.0L40.0 30.0M55.0 56.5L40.0 30.0M55.0 56.5L16.0 44.0M55.0 56.5L80.0 14.0M55.0 56.5L106.7 52.3M55.0 56.5L56.0 108.7M106.7 52.3L120.0 22.0M106.7 52.3L146.8 60.7M106.7 52.3L100.9 93.5M106.7 52.3L80.0 14.0M146.8 60.7L153.1 97.1M146.8 60.7L186.0 40.0M146.8 60.7L120.0 22.0M146.8 60.7L160.0 12.0M56.0 108.7L72.0 126.8M56.0 108.7L24.0 140.0M56.0 108.7L100.9 93.5M56.0 108.7L10.0 90.0M56.0 108.7L44.2 157.4M100.9 93.5L119.7 129.0M100.9 93.5L72.0 126.8M100.9 93.5L153.1 97.1M153.1 97.1L192.0 90.0M153.1 97.1L119.7 129.0M153.1 97.1L178.0 140.0M72.0 126.8L84.0 152.0M72.0 126.8L100.0 146.0M72.0 126.8L44.2 157.4M119.7 129.0L116.0 152.0M119.7 129.0L100.0 146.0M119.7 129.0L84.0 152.0M44.2 157.4L24.0 140.0M44.2 157.4L54.6 191.2M44.2 157.4L36.0 196.0M44.2 157.4L84.0 152.0M161.1 163.4L178.0 140.0M161.1 163.4L141.1 193.1M161.1 163.4L166.0 200.0M161.1 163.4L116.0 152.0M161.1 163.4L132.0 204.0M54.6 191.2L36.0 196.0M54.6 191.2L70.0 204.0M54.6 191.2L52.0 236.0M54.6 191.2L84.0 152.0M141.1 193.1L132.0 204.0M141.1 193.1L166.0 200.0M141.1 193.1L150.0 236.0M141.1 193.1L116.0 152.0' fill='none' stroke='%230f79bd' stroke-width='0.9'/%3E%3Cg fill='%230f79bd'%3E%3Ccircle cx='40.0' cy='30.0' r='1.8'/%3E%3Ccircle cx='80.0' cy='14.0' r='1.8'/%3E%3Ccircle cx='120.0' cy='22.0' r='1.8'/%3E%3Ccircle cx='160.0' cy='12.0' r='1.8'/%3E%3Ccircle cx='186.0' cy='40.0' r='1.8'/%3E%3Ccircle cx='192.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='178.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='166.0' cy='200.0' r='1.8'/%3E%3Ccircle cx='150.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='132.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='116.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='100.0' cy='146.0' r='1.8'/%3E%3Ccircle cx='84.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='70.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='52.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='36.0' cy='196.0' r='1.8'/%3E%3Ccircle cx='24.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='10.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='16.0' cy='44.0' r='1.8'/%3E%3Ccircle cx='55.0' cy='56.5' r='1.8'/%3E%3Ccircle cx='106.7' cy='52.3' r='1.8'/%3E%3Ccircle cx='146.8' cy='60.7' r='1.8'/%3E%3Ccircle cx='56.0' cy='108.7' r='1.8'/%3E%3Ccircle cx='100.9' cy='93.5' r='1.8'/%3E%3Ccircle cx='153.1' cy='97.1' r='1.8'/%3E%3Ccircle cx='72.0' cy='126.8' r='1.8'/%3E%3Ccircle cx='119.7' cy='129.0' r='1.8'/%3E%3Ccircle cx='44.2' cy='157.4' r='1.8'/%3E%3Ccircle cx='161.1' cy='163.4' r='1.8'/%3E%3Ccircle cx='54.6' cy='191.2' r='1.8'/%3E%3Ccircle cx='141.1' cy='193.1' r='1.8'/%3E%3C/g%3E%3C/svg%3E");--mesh-d:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 250'%3E%3Cpath d='M40.0 30.0L80.0 14.0M80.0 14.0L120.0 22.0M120.0 22.0L160.0 12.0M160.0 12.0L186.0 40.0M186.0 40.0L192.0 90.0M192.0 90.0L178.0 140.0M178.0 140.0L166.0 200.0M166.0 200.0L150.0 236.0M150.0 236.0L132.0 204.0M132.0 204.0L116.0 152.0M116.0 152.0L100.0 146.0M100.0 146.0L84.0 152.0M84.0 152.0L70.0 204.0M70.0 204.0L52.0 236.0M52.0 236.0L36.0 196.0M36.0 196.0L24.0 140.0M24.0 140.0L10.0 90.0M10.0 90.0L16.0 44.0M16.0 44.0L40.0 30.0M55.0 60.9L40.0 30.0M55.0 60.9L16.0 44.0M55.0 60.9L48.6 105.7M55.0 60.9L100.5 46.5M55.0 60.9L80.0 14.0M100.5 46.5L120.0 22.0M100.5 46.5L137.4 49.3M100.5 46.5L80.0 14.0M100.5 46.5L98.0 98.4M137.4 49.3L120.0 22.0M137.4 49.3L160.0 12.0M137.4 49.3L186.0 40.0M137.4 49.3L150.8 99.9M48.6 105.7L76.3 131.7M48.6 105.7L10.0 90.0M48.6 105.7L24.0 140.0M48.6 105.7L98.0 98.4M98.0 98.4L127.2 119.2M98.0 98.4L76.3 131.7M98.0 98.4L100.0 146.0M150.8 99.9L127.2 119.2M150.8 99.9L192.0 90.0M150.8 99.9L178.0 140.0M150.8 99.9L98.0 98.4M76.3 131.7L84.0 152.0M76.3 131.7L100.0 146.0M76.3 131.7L116.0 152.0M127.2 119.2L116.0 152.0M127.2 119.2L100.0 146.0M127.2 119.2L158.8 158.7M40.2 158.5L24.0 140.0M40.2 158.5L57.1 189.4M40.2 158.5L36.0 196.0M40.2 158.5L84.0 152.0M40.2 158.5L76.3 131.7M158.8 158.7L178.0 140.0M158.8 158.7L166.0 200.0M158.8 158.7L139.5 197.3M158.8 158.7L116.0 152.0M57.1 189.4L70.0 204.0M57.1 189.4L36.0 196.0M57.1 189.4L84.0 152.0M57.1 189.4L52.0 236.0M139.5 197.3L132.0 204.0M139.5 197.3L166.0 200.0M139.5 197.3L150.0 236.0M139.5 197.3L116.0 152.0' fill='none' stroke='%230f79bd' stroke-width='0.9'/%3E%3Cg fill='%230f79bd'%3E%3Ccircle cx='40.0' cy='30.0' r='1.8'/%3E%3Ccircle cx='80.0' cy='14.0' r='1.8'/%3E%3Ccircle cx='120.0' cy='22.0' r='1.8'/%3E%3Ccircle cx='160.0' cy='12.0' r='1.8'/%3E%3Ccircle cx='186.0' cy='40.0' r='1.8'/%3E%3Ccircle cx='192.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='178.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='166.0' cy='200.0' r='1.8'/%3E%3Ccircle cx='150.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='132.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='116.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='100.0' cy='146.0' r='1.8'/%3E%3Ccircle cx='84.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='70.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='52.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='36.0' cy='196.0' r='1.8'/%3E%3Ccircle cx='24.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='10.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='16.0' cy='44.0' r='1.8'/%3E%3Ccircle cx='55.0' cy='60.9' r='1.8'/%3E%3Ccircle cx='100.5' cy='46.5' r='1.8'/%3E%3Ccircle cx='137.4' cy='49.3' r='1.8'/%3E%3Ccircle cx='48.6' cy='105.7' r='1.8'/%3E%3Ccircle cx='98.0' cy='98.4' r='1.8'/%3E%3Ccircle cx='150.8' cy='99.9' r='1.8'/%3E%3Ccircle cx='76.3' cy='131.7' r='1.8'/%3E%3Ccircle cx='127.2' cy='119.2' r='1.8'/%3E%3Ccircle cx='40.2' cy='158.5' r='1.8'/%3E%3Ccircle cx='158.8' cy='158.7' r='1.8'/%3E%3Ccircle cx='57.1' cy='189.4' r='1.8'/%3E%3Ccircle cx='139.5' cy='197.3' r='1.8'/%3E%3C/g%3E%3C/svg%3E");--mesh-f:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 250'%3E%3Cpath d='M40.0 30.0L80.0 14.0M80.0 14.0L120.0 22.0M120.0 22.0L160.0 12.0M160.0 12.0L186.0 40.0M186.0 40.0L192.0 90.0M192.0 90.0L178.0 140.0M178.0 140.0L166.0 200.0M166.0 200.0L150.0 236.0M150.0 236.0L132.0 204.0M132.0 204.0L116.0 152.0M116.0 152.0L100.0 146.0M100.0 146.0L84.0 152.0M84.0 152.0L70.0 204.0M70.0 204.0L52.0 236.0M52.0 236.0L36.0 196.0M36.0 196.0L24.0 140.0M24.0 140.0L10.0 90.0M10.0 90.0L16.0 44.0M16.0 44.0L40.0 30.0M55.0 51.3L40.0 30.0M55.0 51.3L94.3 54.7M55.0 51.3L16.0 44.0M55.0 51.3L80.0 14.0M55.0 51.3L55.2 102.8M94.3 54.7L95.1 89.2M94.3 54.7L120.0 22.0M94.3 54.7L80.0 14.0M94.3 54.7L142.0 52.0M142.0 52.0L120.0 22.0M142.0 52.0L160.0 12.0M142.0 52.0L186.0 40.0M142.0 52.0L148.5 102.6M55.2 102.8L80.6 122.5M55.2 102.8L95.1 89.2M55.2 102.8L10.0 90.0M55.2 102.8L24.0 140.0M95.1 89.2L80.6 122.5M95.1 89.2L120.7 123.4M95.1 89.2L148.5 102.6M148.5 102.6L120.7 123.4M148.5 102.6L192.0 90.0M148.5 102.6L178.0 140.0M148.5 102.6L156.4 154.1M80.6 122.5L84.0 152.0M80.6 122.5L100.0 146.0M80.6 122.5L120.7 123.4M120.7 123.4L116.0 152.0M120.7 123.4L100.0 146.0M50.2 159.6L24.0 140.0M50.2 159.6L84.0 152.0M50.2 159.6L36.0 196.0M50.2 159.6L59.5 201.5M50.2 159.6L80.6 122.5M156.4 154.1L178.0 140.0M156.4 154.1L116.0 152.0M156.4 154.1L166.0 200.0M156.4 154.1L120.7 123.4M156.4 154.1L152.0 201.6M59.5 201.5L70.0 204.0M59.5 201.5L36.0 196.0M59.5 201.5L52.0 236.0M59.5 201.5L84.0 152.0M152.0 201.6L166.0 200.0M152.0 201.6L132.0 204.0M152.0 201.6L150.0 236.0M152.0 201.6L116.0 152.0' fill='none' stroke='%230f79bd' stroke-width='0.9'/%3E%3Cg fill='%230f79bd'%3E%3Ccircle cx='40.0' cy='30.0' r='1.8'/%3E%3Ccircle cx='80.0' cy='14.0' r='1.8'/%3E%3Ccircle cx='120.0' cy='22.0' r='1.8'/%3E%3Ccircle cx='160.0' cy='12.0' r='1.8'/%3E%3Ccircle cx='186.0' cy='40.0' r='1.8'/%3E%3Ccircle cx='192.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='178.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='166.0' cy='200.0' r='1.8'/%3E%3Ccircle cx='150.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='132.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='116.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='100.0' cy='146.0' r='1.8'/%3E%3Ccircle cx='84.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='70.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='52.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='36.0' cy='196.0' r='1.8'/%3E%3Ccircle cx='24.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='10.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='16.0' cy='44.0' r='1.8'/%3E%3Ccircle cx='55.0' cy='51.3' r='1.8'/%3E%3Ccircle cx='94.3' cy='54.7' r='1.8'/%3E%3Ccircle cx='142.0' cy='52.0' r='1.8'/%3E%3Ccircle cx='55.2' cy='102.8' r='1.8'/%3E%3Ccircle cx='95.1' cy='89.2' r='1.8'/%3E%3Ccircle cx='148.5' cy='102.6' r='1.8'/%3E%3Ccircle cx='80.6' cy='122.5' r='1.8'/%3E%3Ccircle cx='120.7' cy='123.4' r='1.8'/%3E%3Ccircle cx='50.2' cy='159.6' r='1.8'/%3E%3Ccircle cx='156.4' cy='154.1' r='1.8'/%3E%3Ccircle cx='59.5' cy='201.5' r='1.8'/%3E%3Ccircle cx='152.0' cy='201.6' r='1.8'/%3E%3C/g%3E%3C/svg%3E");--mesh-g:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 250'%3E%3Cpath d='M40.0 30.0L80.0 14.0M80.0 14.0L120.0 22.0M120.0 22.0L160.0 12.0M160.0 12.0L186.0 40.0M186.0 40.0L192.0 90.0M192.0 90.0L178.0 140.0M178.0 140.0L166.0 200.0M166.0 200.0L150.0 236.0M150.0 236.0L132.0 204.0M132.0 204.0L116.0 152.0M116.0 152.0L100.0 146.0M100.0 146.0L84.0 152.0M84.0 152.0L70.0 204.0M70.0 204.0L52.0 236.0M52.0 236.0L36.0 196.0M36.0 196.0L24.0 140.0M24.0 140.0L10.0 90.0M10.0 90.0L16.0 44.0M16.0 44.0L40.0 30.0M55.0 55.7L40.0 30.0M55.0 55.7L16.0 44.0M55.0 55.7L47.8 99.8M55.0 55.7L102.1 48.9M55.0 55.7L80.0 14.0M102.1 48.9L120.0 22.0M102.1 48.9L80.0 14.0M102.1 48.9L146.6 54.6M102.1 48.9L92.2 94.1M146.6 54.6L186.0 40.0M146.6 54.6L120.0 22.0M146.6 54.6L160.0 12.0M146.6 54.6L146.2 105.3M47.8 99.8L10.0 90.0M47.8 99.8L92.2 94.1M47.8 99.8L85.0 127.4M47.8 99.8L24.0 140.0M92.2 94.1L85.0 127.4M92.2 94.1L128.1 127.5M92.2 94.1L100.0 146.0M146.2 105.3L128.1 127.5M146.2 105.3L178.0 140.0M146.2 105.3L192.0 90.0M146.2 105.3L92.2 94.1M85.0 127.4L100.0 146.0M85.0 127.4L84.0 152.0M85.0 127.4L116.0 152.0M85.0 127.4L128.1 127.5M128.1 127.5L116.0 152.0M128.1 127.5L100.0 146.0M128.1 127.5L154.1 163.4M46.1 160.7L24.0 140.0M46.1 160.7L36.0 196.0M46.1 160.7L84.0 152.0M46.1 160.7L62.0 199.7M46.1 160.7L70.0 204.0M154.1 163.4L150.4 191.9M154.1 163.4L178.0 140.0M154.1 163.4L166.0 200.0M154.1 163.4L116.0 152.0M62.0 199.7L70.0 204.0M62.0 199.7L36.0 196.0M62.0 199.7L52.0 236.0M62.0 199.7L84.0 152.0M150.4 191.9L166.0 200.0M150.4 191.9L132.0 204.0M150.4 191.9L150.0 236.0M150.4 191.9L116.0 152.0' fill='none' stroke='%230f79bd' stroke-width='0.9'/%3E%3Cg fill='%230f79bd'%3E%3Ccircle cx='40.0' cy='30.0' r='1.8'/%3E%3Ccircle cx='80.0' cy='14.0' r='1.8'/%3E%3Ccircle cx='120.0' cy='22.0' r='1.8'/%3E%3Ccircle cx='160.0' cy='12.0' r='1.8'/%3E%3Ccircle cx='186.0' cy='40.0' r='1.8'/%3E%3Ccircle cx='192.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='178.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='166.0' cy='200.0' r='1.8'/%3E%3Ccircle cx='150.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='132.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='116.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='100.0' cy='146.0' r='1.8'/%3E%3Ccircle cx='84.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='70.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='52.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='36.0' cy='196.0' r='1.8'/%3E%3Ccircle cx='24.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='10.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='16.0' cy='44.0' r='1.8'/%3E%3Ccircle cx='55.0' cy='55.7' r='1.8'/%3E%3Ccircle cx='102.1' cy='48.9' r='1.8'/%3E%3Ccircle cx='146.6' cy='54.6' r='1.8'/%3E%3Ccircle cx='47.8' cy='99.8' r='1.8'/%3E%3Ccircle cx='92.2' cy='94.1' r='1.8'/%3E%3Ccircle cx='146.2' cy='105.3' r='1.8'/%3E%3Ccircle cx='85.0' cy='127.4' r='1.8'/%3E%3Ccircle cx='128.1' cy='127.5' r='1.8'/%3E%3Ccircle cx='46.1' cy='160.7' r='1.8'/%3E%3Ccircle cx='154.1' cy='163.4' r='1.8'/%3E%3Ccircle cx='62.0' cy='199.7' r='1.8'/%3E%3Ccircle cx='150.4' cy='191.9' r='1.8'/%3E%3C/g%3E%3C/svg%3E");--mesh-e:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 250'%3E%3Cpath d='M40.0 30.0L80.0 14.0M80.0 14.0L120.0 22.0M120.0 22.0L160.0 12.0M160.0 12.0L186.0 40.0M186.0 40.0L192.0 90.0M192.0 90.0L178.0 140.0M178.0 140.0L166.0 200.0M166.0 200.0L150.0 236.0M150.0 236.0L132.0 204.0M132.0 204.0L116.0 152.0M116.0 152.0L100.0 146.0M100.0 146.0L84.0 152.0M84.0 152.0L70.0 204.0M70.0 204.0L52.0 236.0M52.0 236.0L36.0 196.0M36.0 196.0L24.0 140.0M24.0 140.0L10.0 90.0M10.0 90.0L16.0 44.0M16.0 44.0L40.0 30.0M55.0 60.9L40.0 30.0M55.0 60.9L16.0 44.0M55.0 60.9L48.6 105.7M55.0 60.9L100.5 46.5M55.0 60.9L80.0 14.0M100.5 46.5L120.0 22.0M100.5 46.5L137.4 49.3M100.5 46.5L80.0 14.0M100.5 46.5L98.0 98.4M137.4 49.3L120.0 22.0M137.4 49.3L160.0 12.0M137.4 49.3L186.0 40.0M137.4 49.3L150.8 99.9M48.6 105.7L76.3 131.7M48.6 105.7L10.0 90.0M48.6 105.7L24.0 140.0M48.6 105.7L98.0 98.4M98.0 98.4L127.2 119.2M98.0 98.4L76.3 131.7M98.0 98.4L100.0 146.0M150.8 99.9L127.2 119.2M150.8 99.9L192.0 90.0M150.8 99.9L178.0 140.0M150.8 99.9L98.0 98.4M76.3 131.7L84.0 152.0M76.3 131.7L100.0 146.0M76.3 131.7L116.0 152.0M127.2 119.2L116.0 152.0M127.2 119.2L100.0 146.0M127.2 119.2L158.8 158.7M40.2 158.5L24.0 140.0M40.2 158.5L57.1 189.4M40.2 158.5L36.0 196.0M40.2 158.5L84.0 152.0M40.2 158.5L76.3 131.7M158.8 158.7L178.0 140.0M158.8 158.7L166.0 200.0M158.8 158.7L139.5 197.3M158.8 158.7L116.0 152.0M57.1 189.4L70.0 204.0M57.1 189.4L36.0 196.0M57.1 189.4L84.0 152.0M57.1 189.4L52.0 236.0M139.5 197.3L132.0 204.0M139.5 197.3L166.0 200.0M139.5 197.3L150.0 236.0M139.5 197.3L116.0 152.0' fill='none' stroke='%237fc3ee' stroke-width='0.9'/%3E%3Cg fill='%237fc3ee'%3E%3Ccircle cx='40.0' cy='30.0' r='1.8'/%3E%3Ccircle cx='80.0' cy='14.0' r='1.8'/%3E%3Ccircle cx='120.0' cy='22.0' r='1.8'/%3E%3Ccircle cx='160.0' cy='12.0' r='1.8'/%3E%3Ccircle cx='186.0' cy='40.0' r='1.8'/%3E%3Ccircle cx='192.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='178.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='166.0' cy='200.0' r='1.8'/%3E%3Ccircle cx='150.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='132.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='116.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='100.0' cy='146.0' r='1.8'/%3E%3Ccircle cx='84.0' cy='152.0' r='1.8'/%3E%3Ccircle cx='70.0' cy='204.0' r='1.8'/%3E%3Ccircle cx='52.0' cy='236.0' r='1.8'/%3E%3Ccircle cx='36.0' cy='196.0' r='1.8'/%3E%3Ccircle cx='24.0' cy='140.0' r='1.8'/%3E%3Ccircle cx='10.0' cy='90.0' r='1.8'/%3E%3Ccircle cx='16.0' cy='44.0' r='1.8'/%3E%3Ccircle cx='55.0' cy='60.9' r='1.8'/%3E%3Ccircle cx='100.5' cy='46.5' r='1.8'/%3E%3Ccircle cx='137.4' cy='49.3' r='1.8'/%3E%3Ccircle cx='48.6' cy='105.7' r='1.8'/%3E%3Ccircle cx='98.0' cy='98.4' r='1.8'/%3E%3Ccircle cx='150.8' cy='99.9' r='1.8'/%3E%3Ccircle cx='76.3' cy='131.7' r='1.8'/%3E%3Ccircle cx='127.2' cy='119.2' r='1.8'/%3E%3Ccircle cx='40.2' cy='158.5' r='1.8'/%3E%3Ccircle cx='158.8' cy='158.7' r='1.8'/%3E%3Ccircle cx='57.1' cy='189.4' r='1.8'/%3E%3Ccircle cx='139.5' cy='197.3' r='1.8'/%3E%3C/g%3E%3C/svg%3E");} /* LDLA Dental — maquette 2026 Identité tirée du logo : noir plein / maillage blanc, trait bleu, trait rouge. */ :root { --ink: #0a0c0f; --ink-2: #14181e; --ink-3: #20262e; --paper: #f3f5f7; --white: #ffffff; --muted: #5b6573; --muted-dark: #9aa4b1; --line: rgba(10, 12, 15, .12); --line-dark: rgba(255, 255, 255, .14); --blue: #0f79bd; --blue-deep: #0a5a8f; --blue-soft: #e6f1f9; --red: #cd1719; --display: "Barlow Condensed", "Arial Narrow", sans-serif; --body: "Barlow", system-ui, sans-serif; --mono: "IBM Plex Mono", ui-monospace, monospace; --gutter: clamp(16px, 4vw, 56px); --max: 1360px; --header: 72px; } *, *::before, *::after { box-sizing: border-box; } html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; } body { margin: 0; background: var(--white); color: var(--ink); font-family: var(--body); font-size: 17px; line-height: 1.6; -webkit-font-smoothing: antialiased; overflow-x: hidden; } img { display: block; max-width: 100%; height: auto; } a { color: inherit; } p { margin: 0 0 1em; } h1, h2, h3, h4 { margin: 0; font-weight: 600; } .wrap { width: 100%; max-width: var(--max); margin: 0 auto; padding: 0 var(--gutter); } /* ---------- Typographie ---------- */ .display { font-family: var(--display); text-transform: uppercase; font-weight: 600; letter-spacing: -.01em; line-height: .92; } .h1 { font-size: clamp(3.1rem, 10.5vw, 9.4rem); } .h2 { font-size: clamp(2.4rem, 6.4vw, 5.6rem); } .h3 { font-size: clamp(1.7rem, 3.4vw, 2.6rem); line-height: 1; } .lead { font-size: clamp(1.08rem, 1.5vw, 1.3rem); line-height: 1.55; color: var(--muted); max-width: 40ch; } .on-dark .lead, .lead.light { color: var(--muted-dark); } .blue { color: var(--blue); } .mesh-text { color: transparent; -webkit-text-stroke: 1.5px currentColor; } .mesh-text.ink { -webkit-text-stroke-color: var(--ink); } .mesh-text.white { -webkit-text-stroke-color: #fff; } .label { font-family: var(--mono); font-size: .76rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); display: inline-flex; align-items: center; gap: .7em; } .on-dark .label { color: var(--muted-dark); } .label::before { content: ""; width: 22px; height: 3px; background: linear-gradient(90deg, var(--blue) 0 45%, transparent 45% 55%, var(--red) 55%); } .label.plain::before { display: none; } /* ---------- Boutons ---------- */ .btn { --bg: var(--blue); display: inline-flex; align-items: center; justify-content: center; gap: .75em; min-height: 52px; padding: 0 1.6em; border-radius: 999px; border: 1.5px solid transparent; background: var(--bg); color: #fff; font: 600 1rem/1.1 var(--body); text-decoration: none; transition: background .25s, box-shadow .25s, transform .25s, border-color .25s, color .25s; cursor: pointer; } .btn svg { width: 18px; height: 18px; flex: none; transition: transform .25s; } .btn:hover { background: var(--blue-deep); box-shadow: 0 12px 30px rgba(15, 121, 189, .35); transform: translateY(-1px); } .btn:hover svg { transform: translateX(4px); } .btn.ghost { background: transparent; color: var(--ink); border-color: rgba(10, 12, 15, .22); } .btn.ghost:hover { border-color: var(--ink); background: transparent; box-shadow: none; } .on-dark .btn.ghost, .btn.ghost.light { color: #fff; border-color: rgba(255, 255, 255, .3); } .on-dark .btn.ghost:hover, .btn.ghost.light:hover { border-color: #fff; } .btn.white { background: #fff; color: var(--ink); } .btn.white:hover { background: var(--paper); box-shadow: 0 12px 30px rgba(0, 0, 0, .25); } .btns { display: flex; flex-wrap: wrap; gap: 12px; } .link-arrow { display: inline-flex; align-items: center; gap: .6em; font-weight: 600; text-decoration: none; border-bottom: 1.5px solid currentColor; padding-bottom: 2px; } .link-arrow svg { width: 16px; height: 16px; transition: transform .25s; } .link-arrow:hover svg { transform: translateX(4px); } /* ---------- En-tête ---------- */ .site-header { position: sticky; top: 0; z-index: 50; height: var(--header); background: rgba(255, 255, 255, .86); backdrop-filter: saturate(1.4) blur(14px); -webkit-backdrop-filter: saturate(1.4) blur(14px); border-bottom: 1px solid transparent; transition: border-color .3s; } .site-header.scrolled { border-bottom-color: var(--line); } .site-header .wrap { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 24px; } .brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; flex: none; } .brand img { width: 40px; height: 40px; } .brand-word { display: flex; flex-direction: column; gap: 4px; } .brand-word b { font: 700 1.32rem/1 var(--display); letter-spacing: .1em; } .brand-word i { display: block; width: 100%; height: 3px; background: linear-gradient(90deg, transparent 0 22%, var(--blue) 22% 40%, transparent 40% 60%, var(--red) 60% 78%, transparent 78%); } .nav { display: none; } .nav a { text-decoration: none; font-weight: 500; font-size: .95rem; padding: 8px 0; position: relative; white-space: nowrap; } .nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: 2px; height: 2px; background: var(--blue); transition: right .3s; } .nav a:hover::after, .nav a[aria-current]::after { right: 0; } .header-cta { display: none; } .burger { width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--line); background: #fff; display: grid; place-items: center; cursor: pointer; padding: 0; } .burger span, .burger span::before, .burger span::after { display: block; width: 18px; height: 1.5px; background: var(--ink); position: relative; transition: transform .3s, background .3s; } .burger span::before, .burger span::after { content: ""; position: absolute; left: 0; } .burger span::before { top: -6px; } .burger span::after { top: 6px; } .menu-open .burger span { background: transparent; } .menu-open .burger span::before { transform: translateY(6px) rotate(45deg); } .menu-open .burger span::after { transform: translateY(-6px) rotate(-45deg); } .mobile-menu { position: fixed; inset: var(--header) 0 0 0; z-index: 49; background: var(--ink); color: #fff; padding: 28px var(--gutter) 140px; overflow-y: auto; opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity .3s, transform .3s, visibility .3s; } .menu-open .mobile-menu { opacity: 1; visibility: visible; transform: none; } .menu-open { overflow: hidden; } .mobile-menu a.m-link { display: flex; justify-content: space-between; align-items: baseline; padding: 16px 0; border-bottom: 1px solid var(--line-dark); text-decoration: none; font: 600 2rem/1 var(--display); text-transform: uppercase; } .mobile-menu a.m-link small { font: 400 .72rem var(--mono); color: var(--muted-dark); letter-spacing: .06em; } .mobile-menu .btns { margin-top: 28px; } /* ---------- Héros accueil ---------- */ .hero { position: relative; padding: clamp(36px, 6vw, 80px) 0 0; overflow: hidden; background: linear-gradient(var(--white), var(--white)) padding-box; } .hero-grid { position: relative; z-index: 2; } .hero .label { margin-bottom: 22px; } .hero h1 { position: relative; z-index: 3; } .hero h1 .row { display: block; white-space: nowrap; } .hero-bottom { display: grid; gap: 28px; margin-top: 28px; position: relative; z-index: 3; } .hero-object { position: relative; margin: 8px calc(var(--gutter) * -1) 0; height: clamp(250px, 62vw, 640px); z-index: 2; } .hero-object .scanner { position: absolute; width: min(1080px, 145%); max-width: none; right: -24%; bottom: -2%; filter: drop-shadow(0 40px 50px rgba(10, 12, 15, .18)); } .hero-object::before { position: absolute; z-index: 1; left: -6%; bottom: 6%; width: min(560px, 74%); color: var(--ink); opacity: .9; } .hero-axis { position: absolute; inset: 0; z-index: 0; pointer-events: none; } .hero-axis::before { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; border-left: 1px dashed var(--line); } .hero-strip { position: relative; z-index: 3; background: var(--ink); color: #fff; } .hero-strip .wrap { display: grid; grid-template-columns: 1fr; gap: 0; } .hero-strip a { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 16px; padding: 20px 0; text-decoration: none; border-bottom: 1px solid var(--line-dark); } .hero-strip a:last-child { border-bottom: 0; } .hero-strip .n { font: 500 .78rem var(--mono); color: var(--muted-dark); } .hero-strip .t { font: 600 1.45rem/1 var(--display); text-transform: uppercase; letter-spacing: .01em; } .hero-strip .t small { display: block; font: 400 .78rem/1.4 var(--body); text-transform: none; color: var(--muted-dark); margin-top: 6px; letter-spacing: 0; } .hero-strip svg { width: 20px; height: 20px; transition: transform .25s; } .hero-strip a:hover svg { transform: translateX(5px); } .hero-strip a:hover .t { color: #7fc3ee; } /* ---------- Sections ---------- */ .section { padding: clamp(72px, 11vw, 150px) 0; position: relative; } .section.tight { padding: clamp(56px, 8vw, 100px) 0; } .paper { background: var(--paper); } .on-dark { background: var(--ink); color: #fff; } .on-blue { background: var(--blue); color: #fff; } .on-blue .label { color: rgba(255, 255, 255, .8); } .on-blue .label::before { background: #fff; } .on-blue .lead { color: rgba(255, 255, 255, .82); } .sec-head { display: grid; gap: 22px; margin-bottom: clamp(40px, 6vw, 80px); } .sec-head .lead { margin: 0; } /* Les deux publics — moitié pleine, moitié maillage, comme le logo */ .halves { display: grid; grid-template-columns: 1fr; } .half { position: relative; overflow: hidden; padding: clamp(56px, 8vw, 110px) var(--gutter); display: flex; flex-direction: column; gap: 36px; } .half.solid { background: var(--ink); color: #fff; } .half.wire { background: var(--white); border-top: 1px solid var(--line); } .half .who { font: 500 .78rem var(--mono); letter-spacing: .08em; text-transform: uppercase; } .half.solid .who { color: #7fc3ee; } .half.wire .who { color: var(--blue); } .half h2 { max-width: 13ch; font-size: clamp(2.4rem, 4.4vw, 4.4rem) !important; } .half p { max-width: 42ch; } .half.solid p { color: var(--muted-dark); } .half.wire p { color: var(--muted); } .half ul.ticks { list-style: none; padding: 0; margin: 0 0 32px; display: grid; gap: 10px; } .half ul.ticks li { display: flex; gap: 12px; align-items: baseline; font-weight: 500; } .half ul.ticks li::before { content: ""; flex: none; width: 10px; height: 2px; background: currentColor; transform: translateY(-4px); } .half.solid ul.ticks li::before { background: #7fc3ee; } .half.wire ul.ticks li::before { background: var(--blue); } .half::before { position: absolute; pointer-events: none; z-index: 0; right: -8%; top: 28px; width: min(380px, 52%); opacity: .18; } .half.wire::before { opacity: .5; color: var(--blue); } .half > * { position: relative; z-index: 1; } .half-photo { margin: 0 calc(var(--gutter) * -1) calc(clamp(56px, 8vw, 110px) * -1); height: 260px; overflow: hidden; } .half-photo img { width: 100%; height: 100%; object-fit: cover; } /* Index des trois univers : lignes éditoriales, pas de cartes */ .univers { border-top: 1px solid var(--line); } .u-row { position: relative; display: grid; grid-template-columns: 1fr; gap: 14px; padding: 34px 0 38px; border-bottom: 1px solid var(--line); text-decoration: none; } .u-row .u-n { font: 500 .8rem var(--mono); color: var(--muted); display: flex; gap: 14px; align-items: center; } .u-row .u-n em { font-style: normal; color: var(--blue); } .u-row h3 { font-size: clamp(2.3rem, 6.6vw, 5.4rem); transition: color .3s, transform .4s; } .u-row p { color: var(--muted); margin: 0; max-width: 46ch; } .u-row .u-go { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; color: var(--blue); } .u-row .u-go svg { width: 18px; height: 18px; transition: transform .25s; } .u-row .u-img { height: 220px; overflow: hidden; border-radius: 2px; } .u-row .u-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s; } .u-row:hover h3 { color: var(--blue); } .u-row:hover .u-go svg { transform: translateX(5px); } .u-row:hover .u-img img { transform: scale(1.04); } /* Le flux numérique */ .flux { position: relative; } .flux-line { display: grid; grid-template-columns: 1fr; gap: 0; counter-reset: step; border-left: 1px solid var(--line-dark); margin-left: 6px; } .flux-step { position: relative; padding: 0 0 40px 34px; } .flux-step::before { content: ""; position: absolute; left: -7px; top: 6px; width: 13px; height: 13px; border-radius: 50%; background: var(--ink); border: 2px solid #7fc3ee; } .flux-step:last-child { padding-bottom: 0; } .flux-step:last-child::before { background: var(--red); border-color: var(--red); } .flux-step .k { font: 500 .74rem var(--mono); color: var(--muted-dark); letter-spacing: .08em; text-transform: uppercase; } .flux-step h4 { font: 600 1.7rem/1.05 var(--display); text-transform: uppercase; margin: 8px 0 8px; } .flux-step p { color: var(--muted-dark); font-size: .98rem; margin: 0; max-width: 34ch; } .flux-visual { margin-top: 56px; display: grid; grid-template-columns: 1.2fr 1fr; gap: 10px; } .flux-visual figure { margin: 0; overflow: hidden; } .flux-visual img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4/5; } .flux-visual figure:first-child img { aspect-ratio: 4/5; } .flux-visual figcaption { font: 400 .72rem var(--mono); color: var(--muted-dark); padding-top: 10px; } /* Bloc CIL Dental */ .cil-hero { display: grid; gap: 40px; } .cil-mark { font: 700 clamp(5rem, 24vw, 19rem)/.78 var(--display); letter-spacing: -.02em; color: transparent; -webkit-text-stroke: 1.5px rgba(255, 255, 255, .35); user-select: none; } .cil-mark em { color: #fff; -webkit-text-stroke: 0; } .cil-mark.ink { -webkit-text-stroke-color: rgba(10, 12, 15, .3); } .cil-mark.ink span { color: var(--red); } .spec { width: 100%; border-collapse: collapse; font-size: .98rem; } .spec th, .spec td { text-align: left; padding: 18px 0; border-bottom: 1px solid var(--line); vertical-align: top; } .on-dark .spec th, .on-dark .spec td { border-bottom-color: var(--line-dark); } .spec th { font: 500 .74rem var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); width: 38%; padding-right: 20px; } .on-dark .spec th { color: var(--muted-dark); } .spec td b { display: block; font: 600 1.35rem/1.1 var(--display); text-transform: uppercase; letter-spacing: .01em; } .spec td span { color: var(--muted); font-size: .95rem; } .on-dark .spec td span { color: var(--muted-dark); } .spec tr.new td b::after { content: "Nouveau"; display: inline-block; margin-left: 10px; vertical-align: middle; font: 500 .62rem/1 var(--mono); letter-spacing: .1em; text-transform: uppercase; background: var(--red); color: #fff; padding: 5px 7px 4px; border-radius: 2px; } .overlap { position: relative; } .overlap .ov-main { width: 100%; aspect-ratio: 4/3; object-fit: cover; } .overlap .ov-small { position: absolute; width: 46%; aspect-ratio: 1; object-fit: cover; right: -4%; bottom: -14%; border: 6px solid var(--ink); } .on-paper .overlap .ov-small, .overlap.light .ov-small { border-color: var(--white); } /* Réassurance : liste numérotée sur filet */ .proof { display: grid; grid-template-columns: 1fr; border-top: 1px solid var(--line); } .proof > div { padding: 28px 0; border-bottom: 1px solid var(--line); display: grid; grid-template-columns: 56px 1fr; gap: 12px; } .proof .pn { font: 500 .8rem var(--mono); color: var(--blue); padding-top: 6px; } .proof h4 { font: 600 1.5rem/1.05 var(--display); text-transform: uppercase; margin-bottom: 8px; } .proof p { color: var(--muted); margin: 0; font-size: .98rem; } /* Bandeau société */ .story { display: grid; gap: 40px; align-items: end; } .story figure { margin: 0; position: relative; } .story figure img { width: 100%; aspect-ratio: 4/5; object-fit: cover; filter: grayscale(1) contrast(1.05); } .story figure::after { content: ""; position: absolute; left: 0; bottom: 0; width: 38%; height: 6px; background: linear-gradient(90deg, var(--blue) 0 47%, transparent 47% 53%, var(--red) 53%); } .story .place { font: 600 clamp(4rem, 16vw, 12rem)/.8 var(--display); text-transform: uppercase; letter-spacing: -.02em; } .story .coords { font: 400 .78rem var(--mono); color: var(--muted); margin-top: 14px; } /* CTA final */ .final { position: relative; overflow: hidden; background: var(--blue); color: #fff; padding: clamp(80px, 12vw, 160px) 0; } .final h2 { max-width: 13ch; } .final::before { position: absolute; right: -10%; top: -20%; width: min(720px, 90%); color: #fff; opacity: .22; pointer-events: none; } .final .wrap { position: relative; z-index: 1; display: grid; gap: 36px; } .final .btn { --bg: #fff; color: var(--ink); } .final .btn:hover { background: var(--ink); color: #fff; box-shadow: 0 12px 30px rgba(0, 0, 0, .3); } .final .btn.ghost { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .45); } .final .btn.ghost:hover { border-color: #fff; background: transparent; } /* ---------- Pages intérieures ---------- */ .page-hero { position: relative; padding: clamp(48px, 8vw, 110px) 0 clamp(48px, 7vw, 90px); overflow: hidden; } .page-hero .crumb { font: 400 .76rem var(--mono); color: var(--muted); margin-bottom: 26px; display: flex; gap: 10px; flex-wrap: wrap; } .page-hero .crumb a { text-decoration: none; } .page-hero .crumb a:hover { color: var(--blue); } .on-dark.page-hero .crumb { color: var(--muted-dark); } .page-hero h1 { font-size: clamp(2.9rem, 9vw, 8rem); max-width: 14ch; } .page-hero .ph-bottom { display: grid; gap: 28px; margin-top: 30px; } .page-hero::before { position: absolute; right: -8%; top: 10%; width: min(520px, 70%); opacity: .5; color: var(--blue); pointer-events: none; z-index: 0; } .page-hero .wrap { position: relative; z-index: 1; } .page-hero .audience { display: inline-flex; align-items: center; gap: 8px; font: 500 .74rem var(--mono); letter-spacing: .08em; text-transform: uppercase; border: 1px solid currentColor; padding: 7px 12px 6px; border-radius: 999px; margin-bottom: 22px; color: var(--blue); } .on-dark .audience { color: #7fc3ee; } .wide-photo { position: relative; height: clamp(280px, 52vw, 680px); overflow: hidden; } .wide-photo img { width: 100%; height: 100%; object-fit: cover; } .wide-photo .tag { position: absolute; left: var(--gutter); bottom: 20px; font: 400 .72rem var(--mono); color: #fff; background: rgba(10, 12, 15, .6); padding: 6px 10px; backdrop-filter: blur(6px); } .cols { display: grid; gap: 40px; } .prose p { color: var(--muted); } .prose p strong { color: var(--ink); } .on-dark .prose p { color: var(--muted-dark); } .on-dark .prose p strong { color: #fff; } /* Étapes du pack */ .steps { display: grid; grid-template-columns: 1fr; counter-reset: s; } .step { position: relative; padding: 34px 0 34px 0; border-top: 1px solid var(--line); display: grid; grid-template-columns: 1fr; gap: 14px; } .step .big { font: 600 clamp(4.5rem, 12vw, 9rem)/.8 var(--display); color: transparent; -webkit-text-stroke: 1.5px var(--blue); } .step h3 { font: 600 clamp(1.8rem, 3.6vw, 2.8rem)/1 var(--display); text-transform: uppercase; } .step p { color: var(--muted); max-width: 52ch; margin: 0; } .step .meta { font: 400 .76rem var(--mono); color: var(--blue); text-transform: uppercase; letter-spacing: .06em; } /* Produits caméra */ .product { display: grid; gap: 32px; align-items: center; padding: clamp(48px, 7vw, 90px) 0; border-top: 1px solid var(--line); } .product:first-of-type { border-top: 0; } .product .p-img { background: var(--paper); aspect-ratio: 4/3; overflow: hidden; display: grid; place-items: center; } .product .p-img img { width: 100%; height: 100%; object-fit: cover; } .product .p-name { font: 600 clamp(2.3rem, 5.6vw, 4.6rem)/.92 var(--display); text-transform: uppercase; } .product .p-name small { display: block; font: 500 .78rem var(--mono); letter-spacing: .08em; color: var(--blue); margin-bottom: 14px; } .product .p-figure { font: 600 clamp(3.4rem, 8vw, 6rem)/.8 var(--display); color: var(--blue); margin: 26px 0 6px; } .product .p-figure small { font-size: .35em; vertical-align: top; margin-left: 4px; } .product .p-cap { font: 400 .78rem var(--mono); color: var(--muted); text-transform: uppercase; letter-spacing: .06em; } /* Matières */ .mat-table { border-top: 2px solid var(--ink); } .mat { display: grid; grid-template-columns: 1fr; gap: 10px; padding: 26px 0; border-bottom: 1px solid var(--line); } .mat .m-fam { font: 500 .74rem var(--mono); color: var(--muted); letter-spacing: .08em; text-transform: uppercase; } .mat .m-name { font: 600 2rem/1 var(--display); text-transform: uppercase; } .mat .m-desc { color: var(--muted); margin: 0; } .mat .m-sw { display: flex; gap: 0; height: 10px; margin-top: 6px; max-width: 220px; } .mat .m-sw i { flex: 1; } .contrast { display: grid; gap: 2px; background: var(--line); border: 1px solid var(--line); } .contrast > div { background: var(--white); padding: clamp(28px, 4vw, 48px); } .contrast .c-k { font: 500 .74rem var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--blue); } .contrast h3 { font: 600 clamp(2rem, 4vw, 3.2rem)/.95 var(--display); text-transform: uppercase; margin: 14px 0 16px; } .contrast dl { display: grid; grid-template-columns: auto 1fr; gap: 10px 22px; margin: 22px 0 0; font-size: .95rem; } .contrast dt { font: 500 .72rem var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); padding-top: 3px; } .contrast dd { margin: 0; font-weight: 500; } .contrast .vs { background: var(--ink); color: #fff; display: grid; place-items: center; padding: 14px; font: 600 1.4rem var(--display); } .chips { display: flex; flex-wrap: wrap; gap: 8px; } .chips span { border: 1px solid var(--line); border-radius: 999px; padding: 8px 14px; font-weight: 500; font-size: .92rem; background: #fff; } .on-dark .chips span { border-color: var(--line-dark); background: transparent; } /* Stratasys */ .j5 { position: relative; overflow: hidden; } .j5 .j5-grid { display: grid; gap: 40px; } .j5 h2 { max-width: 16ch; } .j5 ul.points { list-style: none; padding: 0; margin: 30px 0 34px; border-top: 1px solid var(--line-dark); } .j5 ul.points li { padding: 16px 0; border-bottom: 1px solid var(--line-dark); display: grid; grid-template-columns: 34px 1fr; gap: 10px; } .j5 ul.points li b { font: 500 .78rem var(--mono); color: #7fc3ee; padding-top: 4px; } .j5 figure { margin: 0; position: relative; } .j5 figure img { width: 100%; aspect-ratio: 4/5; object-fit: cover; } .j5 figure figcaption { font: 400 .72rem var(--mono); color: var(--muted-dark); margin-top: 10px; } .upload { display: grid; gap: 24px; border: 1.5px dashed rgba(255, 255, 255, .3); padding: clamp(28px, 4vw, 48px); } .upload.light { border-color: rgba(10, 12, 15, .25); } /* Formation */ .timeline { border-left: 2px solid var(--ink); margin-left: 4px; } .timeline > div { position: relative; padding: 0 0 38px 30px; } .timeline > div::before { content: ""; position: absolute; left: -7px; top: 8px; width: 12px; height: 12px; background: var(--blue); } .timeline > div:last-child { padding-bottom: 0; } .timeline h4 { font: 600 1.6rem/1 var(--display); text-transform: uppercase; margin: 6px 0 8px; } .timeline p { color: var(--muted); margin: 0; max-width: 50ch; } .timeline .k { font: 500 .74rem var(--mono); color: var(--blue); letter-spacing: .08em; text-transform: uppercase; } /* Contact */ .contact-grid { display: grid; gap: 48px; } .form { display: grid; gap: 18px; } .seg { display: grid; grid-template-columns: repeat(3, 1fr); border: 1.5px solid var(--ink); border-radius: 999px; padding: 4px; gap: 4px; } .seg button { border: 0; background: transparent; border-radius: 999px; min-height: 46px; font: 600 .95rem var(--body); cursor: pointer; color: var(--ink); padding: 0 6px; } .seg button[aria-pressed="true"] { background: var(--ink); color: #fff; } .field { display: grid; gap: 8px; } .field label { font: 500 .74rem var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); } .field input, .field select, .field textarea { width: 100%; font: 400 1rem var(--body); color: var(--ink); border: 0; border-bottom: 1.5px solid rgba(10, 12, 15, .25); background: transparent; padding: 12px 0; border-radius: 0; outline: none; transition: border-color .2s; -webkit-appearance: none; appearance: none; } .field select { background-image: linear-gradient(45deg, transparent 50%, var(--ink) 50%), linear-gradient(135deg, var(--ink) 50%, transparent 50%); background-position: calc(100% - 12px) 55%, calc(100% - 7px) 55%; background-size: 5px 5px; background-repeat: no-repeat; } .field input:focus, .field select:focus, .field textarea:focus { border-bottom-color: var(--blue); } .field textarea { min-height: 120px; resize: vertical; } .row2 { display: grid; gap: 18px; } .form-note { font: 400 .74rem var(--mono); color: var(--muted); } .form-ok { display: none; padding: 16px 18px; background: var(--blue-soft); color: var(--blue-deep); font-weight: 500; } .form.sent .form-ok { display: block; } .dyn { display: none; } .dyn.on { display: grid; gap: 18px; } .direct { display: grid; gap: 0; border-top: 1px solid var(--line-dark); } .direct a, .direct div.d { display: grid; grid-template-columns: 44px 1fr; gap: 14px; align-items: center; padding: 22px 0; border-bottom: 1px solid var(--line-dark); text-decoration: none; } .direct .ico { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; } .direct .ico svg { width: 20px; height: 20px; } .direct b { display: block; font: 600 1.45rem/1.1 var(--display); text-transform: uppercase; letter-spacing: .01em; } .direct small { color: var(--muted-dark); font-size: .88rem; } .map { margin-top: 28px; aspect-ratio: 16/10; background: var(--ink-3); position: relative; overflow: hidden; background-image: linear-gradient(var(--line-dark) 1px, transparent 1px), linear-gradient(90deg, var(--line-dark) 1px, transparent 1px); background-size: 44px 44px; } .map .pin { position: absolute; left: 52%; top: 46%; transform: translate(-50%, -100%); text-align: center; } .map .pin i { display: block; width: 16px; height: 16px; border-radius: 50%; background: var(--red); margin: 0 auto 8px; box-shadow: 0 0 0 8px rgba(205, 23, 25, .25); } .map .pin span { font: 500 .72rem var(--mono); color: #fff; background: var(--ink); padding: 5px 8px; white-space: nowrap; } .map a { position: absolute; right: 14px; bottom: 14px; font: 500 .74rem var(--mono); color: #fff; } /* ---------- Pied de page ---------- */ .site-footer { background: var(--ink); color: #fff; padding: clamp(64px, 9vw, 110px) 0 calc(110px + env(safe-area-inset-bottom)); } .f-top { display: grid; gap: 44px; padding-bottom: 54px; border-bottom: 1px solid var(--line-dark); } .f-brand img { width: 64px; height: 64px; margin-bottom: 18px; } .f-brand p { color: var(--muted-dark); max-width: 34ch; font-size: .95rem; } .f-col h5 { font: 500 .72rem var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--muted-dark); margin: 0 0 16px; } .f-col ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; } .f-col a { text-decoration: none; color: #fff; } .f-col a:hover { color: #7fc3ee; } .f-bottom { display: flex; flex-wrap: wrap; gap: 14px 28px; justify-content: space-between; padding-top: 26px; font: 400 .74rem var(--mono); color: var(--muted-dark); } .f-bottom a { color: var(--muted-dark); } .f-big { font: 700 clamp(3.6rem, 15vw, 13rem)/.8 var(--display); letter-spacing: .02em; color: transparent; -webkit-text-stroke: 1px rgba(255, 255, 255, .22); margin-top: 56px; white-space: nowrap; overflow: hidden; } /* ---------- Barre mobile ---------- */ .mbar { position: fixed; z-index: 60; left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); display: grid; grid-template-columns: 1fr 1fr 1.25fr; gap: 6px; background: rgba(10, 12, 15, .94); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-radius: 999px; padding: 6px; box-shadow: 0 14px 40px rgba(0, 0, 0, .3); } .mbar a { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; border-radius: 999px; text-decoration: none; color: #fff; font: 600 .88rem var(--body); } .mbar svg { width: 19px; height: 19px; flex: none; } .mbar .call svg { color: #3fd0e8; } .mbar .wa svg { color: #25d366; } .mbar .trial { background: var(--blue); } /* ---------- Mode relecture maquette ---------- */ .tbc { position: relative; } body.review .tbc { background: linear-gradient(transparent 60%, rgba(205, 23, 25, .18) 60%); box-shadow: 0 2px 0 var(--red); } body.review .tbc::after { content: attr(data-tbc); position: absolute; left: 0; top: 100%; z-index: 20; margin-top: 6px; font: 500 .66rem/1.35 var(--mono); letter-spacing: .02em; text-transform: none; color: #fff; background: var(--red); padding: 5px 7px; width: max-content; max-width: 240px; -webkit-text-stroke: 0; white-space: normal; text-align: left; } .review-toggle { position: fixed; z-index: 61; right: 12px; top: calc(var(--header) + 12px); font: 500 .7rem var(--mono); letter-spacing: .04em; text-transform: uppercase; background: #fff; color: var(--ink); border: 1px solid var(--line); border-radius: 999px; padding: 8px 12px; cursor: pointer; box-shadow: 0 6px 20px rgba(0, 0, 0, .08); display: inline-flex; align-items: center; gap: 8px; } .review-toggle i { width: 8px; height: 8px; border-radius: 50%; background: var(--red); } body.review .review-toggle { background: var(--red); color: #fff; border-color: var(--red); } body.review .review-toggle i { background: #fff; } /* ---------- Apparition ---------- */ .rv { opacity: 1; transform: none; } .js .rv { opacity: 0; transform: translateY(24px); transition: opacity .8s cubic-bezier(.2, .7, .2, 1), transform .8s cubic-bezier(.2, .7, .2, 1); } .js .rv.in { opacity: 1; transform: none; } @media (prefers-reduced-motion: reduce) { .js .rv { opacity: 1; transform: none; transition: none; } html { scroll-behavior: auto; } } /* ---------- Tablette ---------- */ @media (min-width: 720px) { .hero-bottom { grid-template-columns: 1.1fr 1fr; align-items: end; } .hero-strip .wrap { grid-template-columns: repeat(3, 1fr); } .hero-strip a { border-bottom: 0; border-right: 1px solid var(--line-dark); padding: 26px 24px 26px 0; } .hero-strip a + a { padding-left: 24px; } .hero-strip a:last-child { border-right: 0; } .u-row { grid-template-columns: 90px 1fr 240px; align-items: center; gap: 28px; } .u-row .u-n { align-self: start; padding-top: 14px; } .u-row .u-img { height: 170px; grid-column: 3; grid-row: 1 / span 3; } .u-row > :not(.u-n):not(.u-img) { grid-column: 2; } .proof { grid-template-columns: 1fr 1fr; column-gap: 48px; } .row2 { grid-template-columns: 1fr 1fr; } .f-top { grid-template-columns: 1.4fr 1fr 1fr 1fr; } .contrast { grid-template-columns: 1fr auto 1fr; } .contrast .vs { font-size: 2rem; } .mat { grid-template-columns: 200px 1fr 1.4fr; align-items: baseline; gap: 28px; } .step { grid-template-columns: 170px 1fr; gap: 32px; align-items: start; } .step .big { grid-row: 1 / span 3; } } /* ---------- Bureau ---------- */ @media (min-width: 1040px) { :root { --header: 84px; } .nav { display: flex; gap: 26px; align-items: center; } .header-cta { display: inline-flex; min-height: 46px; padding: 0 1.3em; font-size: .92rem; } .burger, .mobile-menu { display: none; } .mbar { display: none; } .review-toggle { top: auto; bottom: 18px; right: 18px; } .site-footer { padding-bottom: 40px; } .hero { padding-top: 64px; } .hero-grid { min-height: calc(100vh - var(--header) - 120px); display: flex; flex-direction: column; } .hero h1 { max-width: 10.5ch; font-size: clamp(4rem, 6.6vw, 7.4rem); } .hero-bottom { grid-template-columns: 420px 1fr; max-width: 520px; grid-template-columns: 1fr; margin-top: 34px; } .hero-object { position: absolute; inset: -40px -10% -20px 36%; height: auto; margin: 0; } .hero-object .scanner { width: 112%; right: -12%; bottom: 6%; } .hero-object::before { left: 12%; bottom: 18%; width: 40%; } .hero-axis::before { left: 58%; } .hero-strip a { padding-top: 30px; padding-bottom: 30px; } .halves { grid-template-columns: 1fr 1fr; } .half { padding-left: max(var(--gutter), calc((100vw - var(--max)) / 2 + var(--gutter))); } .half.wire { border-top: 0; padding-left: clamp(40px, 5vw, 80px); padding-right: max(var(--gutter), calc((100vw - var(--max)) / 2 + var(--gutter))); } .half.solid { padding-right: clamp(40px, 5vw, 80px); } .half-photo { height: 300px; margin-left: calc(max(var(--gutter), calc((100vw - var(--max)) / 2 + var(--gutter))) * -1); margin-right: calc(clamp(40px, 5vw, 80px) * -1); } .half.wire .half-photo { margin-left: calc(clamp(40px, 5vw, 80px) * -1); margin-right: calc(max(var(--gutter), calc((100vw - var(--max)) / 2 + var(--gutter))) * -1); } .sec-head.split { grid-template-columns: 1.3fr 1fr; align-items: end; gap: 60px; } .u-row { grid-template-columns: 120px 1fr 340px; padding: 44px 0 48px; } .u-row .u-img { height: 220px; } .flux-wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; } .flux-line { grid-template-columns: repeat(1, 1fr); } .flux-visual { margin-top: 0; position: sticky; top: calc(var(--header) + 30px); } .cil-hero { grid-template-columns: 1fr 1fr; gap: 80px; align-items: end; } .cil-body { display: grid; grid-template-columns: 1fr 1.1fr; gap: 90px; align-items: start; margin-top: 90px; } .story { grid-template-columns: 1fr 1fr; gap: 90px; } .final .wrap { grid-template-columns: 1.4fr 1fr; align-items: end; } .page-hero .ph-bottom { grid-template-columns: 1fr auto; align-items: end; } .cols { grid-template-columns: 1fr 1fr; gap: 90px; } .cols.wide-left { grid-template-columns: 1.3fr 1fr; } .cols.wide-right { grid-template-columns: 1fr 1.3fr; } .product { grid-template-columns: 1.15fr 1fr; gap: 80px; } .product.flip .p-img { order: 2; } .j5 .j5-grid { grid-template-columns: 1fr 1fr; gap: 90px; align-items: center; } .contact-grid { grid-template-columns: 1.2fr 1fr; gap: 90px; align-items: start; } .contact-side { position: sticky; top: calc(var(--header) + 30px); } } @media (min-width: 1400px) { .hero-object .scanner { width: 104%; } } /* Bandeau final sur bleu : textes lisibles */ .final .label { color: rgba(255, 255, 255, .85); } .final .label::before { background: linear-gradient(90deg, #fff 0 45%, transparent 45% 55%, var(--red) 55%); } .final .lead { color: rgba(255, 255, 255, .88); } .half.solid .btn.ghost { color: #fff; border-color: rgba(255, 255, 255, .3); } .half.solid .btn.ghost:hover { border-color: #fff; } @media (max-width: 1039px) { .review-toggle { top: auto; bottom: calc(78px + env(safe-area-inset-bottom)); right: 12px; } } @media (max-width: 1039px) { .hero-object .scanner { width: 122%; right: -42%; bottom: 0; } .hero-object::before { left: -4%; bottom: 4%; width: 70%; max-width: 420px; } } @media (max-width: 1039px) { .hero-object { height: clamp(320px, 92vw, 640px); margin-top: 20px; } .hero-object::before { width: 56%; bottom: 6%; left: 0; } } /* Captures PDF */ .capture .rv { opacity: 1 !important; transform: none !important; transition: none !important; } .capture .review-toggle, .capture .mbar { display: none !important; } .capture .site-header { position: relative; } .capture .site-footer { padding-bottom: 60px; } .capture .hero-grid { min-height: 0 !important; } @media (min-width:1040px){ .capture .hero-grid { min-height: 700px !important; } } /* ========================================================== Adaptations Gutenberg — même rendu que la maquette, en blocs natifs (claude-to-wordpress/references/blocs-gutenberg.md) ========================================================== */ img { height: auto; } p { margin: 0; } :where(.wp-block-group) > :where(*), :where(.wp-block-buttons) { margin-block: 0; } figure.wp-block-image { margin: 0; } .wp-block-group { box-sizing: border-box; } .wp-site-blocks { overflow-x: clip; } ul.wp-block-list { margin: 0; } .fill img { display: block; width: 100%; height: 100%; object-fit: cover; } .muted { color: var(--muted); } .on-dark .muted { color: var(--muted-dark); } .fine { font: 400 .74rem var(--mono); color: var(--muted); } .mt-m { margin-top: 28px !important; } .mt-l { margin-top: 36px !important; } .mb-m { margin-bottom: 26px !important; } .mb-l { margin-bottom: 40px !important; } .no-top { padding-top: 0 !important; } .cols.align-center { align-items: center; } .cols.align-end { align-items: end; } .label + :is(h1, h2, h3) { margin-top: 22px; } .sec-head .label + h2, .half .who + h2 { margin-top: 20px; } :is(h2, h3).display + .lead, :is(h2, h3).display + .muted, .h2 + .chips { margin-top: 22px; } .half h2 + p { margin-top: 24px; } /* ---------- accents des titres : = contour, = bleu ---------- */ .display em { font-style: normal; color: transparent; -webkit-text-stroke: 1.5px var(--stroke, var(--ink)); } .on-dark, .on-blue, .half.solid { --stroke: #fff; } .hero h1 { max-width: none !important; } .display strong { font-weight: inherit; color: var(--blue); } .on-blue .display strong { color: #fff; } /* ---------- maillages décoratifs (pseudo-éléments) ---------- */ .hero-object::before, .half::before, .page-hero::before, .final::before { content: ""; aspect-ratio: 200 / 250; background: no-repeat center / contain; } .hero-object::before { position: absolute; background-image: var(--mesh-hero); } .half.solid::before { background-image: var(--mesh-solid); } .half.wire::before { background-image: var(--mesh-wire); } .final::before { background-image: var(--mesh-final); } .page-hero.art-a::before { background-image: var(--mesh-a); } .page-hero.art-b::before { background-image: var(--mesh-b); } .page-hero.art-c::before { background-image: var(--mesh-c); } .page-hero.art-d::before { background-image: var(--mesh-d); } .page-hero.art-e::before { background-image: var(--mesh-e); opacity: .28; } .page-hero.art-f::before { background-image: var(--mesh-f); } .page-hero.art-g::before { background-image: var(--mesh-g); } .hero-object .scanner img { width: 100%; height: auto; } /* ---------- boutons : la classe est sur le conteneur, le style sur le lien ---------- */ .wp-block-button.btn { display: inline-flex; min-height: 0; padding: 0; border: 0; background: none; box-shadow: none; border-radius: 0; transform: none; } .wp-block-button.btn:hover { background: none; box-shadow: none; transform: none; } .wp-block-button.btn > .wp-block-button__link { display: inline-flex; align-items: center; justify-content: center; gap: .75em; min-height: 52px; padding: 0 1.6em; border-radius: 999px; border: 1.5px solid transparent; background: var(--blue); color: #fff; font: 600 1rem/1.1 var(--body); text-decoration: none; transition: background .25s, box-shadow .25s, transform .25s, border-color .25s, color .25s; } .wp-block-button.btn > .wp-block-button__link:hover { background: var(--blue-deep); box-shadow: 0 12px 30px rgba(15, 121, 189, .35); transform: translateY(-1px); } .wp-block-button.btn.ghost > .wp-block-button__link { background: transparent; color: var(--ink); border-color: rgba(10, 12, 15, .22); } .wp-block-button.btn.ghost > .wp-block-button__link:hover { border-color: var(--ink); box-shadow: none; } .on-dark .wp-block-button.btn.ghost > .wp-block-button__link, .half.solid .wp-block-button.btn.ghost > .wp-block-button__link, .wp-block-button.btn.ghost.light > .wp-block-button__link { color: #fff; border-color: rgba(255, 255, 255, .3); } .wp-block-button.btn.ghost.light > .wp-block-button__link:hover { border-color: #fff; } .wp-block-button.btn.white > .wp-block-button__link { background: #fff; color: var(--ink); } .wp-block-button.btn.white > .wp-block-button__link:hover { background: var(--paper); box-shadow: 0 12px 30px rgba(0, 0, 0, .25); } .final .wp-block-button.btn:not(.ghost) > .wp-block-button__link { background: #fff; color: var(--ink); } .final .wp-block-button.btn:not(.ghost) > .wp-block-button__link:hover { background: var(--ink); color: #fff; } .final .wp-block-button.btn.ghost > .wp-block-button__link { color: #fff; border-color: rgba(255, 255, 255, .45); } /* icônes : masques CSS, pas de SVG dans le contenu */ .wp-block-button.arrow > a::after, .wp-block-button[class*="i-"] > a::before, .u-go::after, .link-arrow-p a::after, .hs .t::after, .mbar a::before, .direct .d::before, .f-col li::marker { -webkit-mask: center / contain no-repeat; mask: center / contain no-repeat; } .wp-block-button.arrow > a::after, .u-go::after, .link-arrow-p a::after, .hs .t::after { content: ""; width: 18px; height: 18px; flex: none; background: currentColor; transition: transform .25s; -webkit-mask-image: var(--i-arrow); mask-image: var(--i-arrow); } .wp-block-button.arrow > a:hover::after { transform: translateX(4px); } .wp-block-button[class*="i-"] > a::before, .mbar a::before { content: ""; width: 18px; height: 18px; flex: none; background: currentColor; } .wp-block-button.i-phone > a::before, .mbar .call a::before, .direct .d-phone::before { -webkit-mask-image: var(--i-phone); mask-image: var(--i-phone); } .wp-block-button.i-chat > a::before, .mbar .wa a::before, .direct .d-wa::before { -webkit-mask-image: var(--i-chat); mask-image: var(--i-chat); } .wp-block-button.i-cal > a::before, .mbar .trial a::before { -webkit-mask-image: var(--i-cal); mask-image: var(--i-cal); } .wp-block-button.i-upload > a::before { -webkit-mask-image: var(--i-upload); mask-image: var(--i-upload); } .wp-block-button.i-doc > a::before { -webkit-mask-image: var(--i-doc); mask-image: var(--i-doc); } .wp-block-button.i-pin > a::before, .direct .d-pin::before { -webkit-mask-image: var(--i-pin); mask-image: var(--i-pin); } .direct .d-mail::before { -webkit-mask-image: var(--i-mail); mask-image: var(--i-mail); } :root { --i-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E"); --i-phone: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2'/%3E%3C/svg%3E"); --i-chat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 11.5a8 8 0 0 1-11.8 7L4 20l1.4-4A8 8 0 1 1 20 11.5Z'/%3E%3C/svg%3E"); --i-cal: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='15' rx='2'/%3E%3Cpath d='M3.5 10h17M8 3v4M16 3v4'/%3E%3C/svg%3E"); --i-upload: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 16V4M7 9l5-5 5 5M4 16v3a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1v-3'/%3E%3C/svg%3E"); --i-doc: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H6a1 1 0 0 0-1 1v16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V8Z'/%3E%3Cpath d='M14 3v5h5M9 13h6M9 17h6'/%3E%3C/svg%3E"); --i-pin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6.2-7-12a7 7 0 0 1 14 0c0 5.8-7 12-7 12Z'/%3E%3Ccircle cx='12' cy='9' r='2.5'/%3E%3C/svg%3E"); --i-mail: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m4 7 8 6 8-6'/%3E%3C/svg%3E"); } /* ---------- en-tête ---------- */ .site-header .head-in { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 24px; } .brand a { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; font: 700 1.32rem/1 var(--display); letter-spacing: .1em; white-space: nowrap; padding-bottom: 7px; background: linear-gradient(90deg, transparent 0 22%, var(--blue) 22% 40%, transparent 40% 60%, var(--red) 60% 78%, transparent 78%) no-repeat right 0 bottom 0 / calc(100% - 50px) 3px; } .brand a::before { content: ""; width: 40px; height: 40px; margin-bottom: -7px; background: url("assets/img/ldla-symbole.png") center / contain no-repeat; } .wp-block-navigation.nav { display: flex; gap: 26px; flex: 1; justify-content: flex-end; } .wp-block-navigation.nav .wp-block-navigation__container { gap: 26px; } .wp-block-navigation.nav .wp-block-navigation-item__content { font-weight: 500; font-size: .95rem; padding: 8px 0; position: relative; text-decoration: none; white-space: nowrap; } .wp-block-navigation.nav .wp-block-navigation-item__content::after { content: ""; position: absolute; left: 0; right: 100%; bottom: 2px; height: 2px; background: var(--blue); transition: right .3s; } .wp-block-navigation.nav .wp-block-navigation-item__content:hover::after, .wp-block-navigation.nav .current-menu-item > .wp-block-navigation-item__content::after { right: 0; } .wp-block-buttons.header-cta { display: none; padding: 0; min-height: 0; } .wp-block-buttons.header-cta .wp-block-button__link { min-height: 46px !important; padding: 0 1.3em !important; font-size: .92rem !important; } .wp-block-navigation.nav .wp-block-navigation__responsive-container-open { width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--line); background: #fff; color: var(--ink); align-items: center; justify-content: center; } .wp-block-navigation.nav .wp-block-navigation__responsive-container.is-menu-open { background-color: var(--ink) !important; color: #fff !important; padding: 90px var(--gutter) 140px; } .wp-block-navigation.nav .is-menu-open .wp-block-navigation__container { gap: 0 !important; width: 100%; align-items: stretch !important; } .wp-block-navigation.nav .is-menu-open .wp-block-navigation-item { width: 100%; border-bottom: 1px solid var(--line-dark); } .wp-block-navigation.nav .is-menu-open .wp-block-navigation-item__content { display: block; width: 100%; padding: 16px 0 !important; color: #fff !important; font: 600 2rem/1 var(--display) !important; text-transform: uppercase; } .wp-block-navigation.nav .is-menu-open .wp-block-navigation-item__content::after { display: none; } .wp-block-navigation.nav .wp-block-navigation__responsive-container-close { color: #fff; } @media (max-width: 1039px) { .wp-block-navigation.nav .wp-block-navigation__responsive-container-open { display: flex; } .wp-block-navigation.nav .wp-block-navigation__responsive-container:not(.is-menu-open) { display: none; } .site-header:has(.is-menu-open) { backdrop-filter: none; -webkit-backdrop-filter: none; } } @media (min-width: 1040px) { .wp-block-navigation.nav .wp-block-navigation__responsive-container-open { display: none; } .wp-block-buttons.header-cta { display: flex; } } @media (max-width: 380px) { .brand a { font-size: 1.12rem; } } /* ---------- héros ---------- */ .hero-strip .wrap { display: grid; } .hs { position: relative; display: grid; grid-template-columns: auto 1fr auto; column-gap: 16px; align-items: center; padding: 20px 0; border-bottom: 1px solid var(--line-dark); } .hs:last-child { border-bottom: 0; } .hs .n { grid-row: 1 / span 2; font: 500 .78rem var(--mono); color: var(--muted-dark); } .hs .t { grid-column: 2 / span 2; display: flex; justify-content: space-between; align-items: center; font: 600 1.45rem/1 var(--display); text-transform: uppercase; letter-spacing: .01em; } .hs .t a { text-decoration: none; } .hs .t a::before { content: ""; position: absolute; inset: 0; } .hs .s { grid-column: 2; font: 400 .78rem/1.4 var(--body); color: var(--muted-dark); margin-top: 6px; } .hs:hover .t { color: #7fc3ee; } .hs:hover .t::after { transform: translateX(5px); } @media (min-width: 720px) { .hero-strip .wrap { grid-template-columns: repeat(3, 1fr); } .hs { border-bottom: 0; border-right: 1px solid var(--line-dark); padding: 26px 24px 26px 0; } .hs + .hs { padding-left: 24px; } .hs:last-child { border-right: 0; } } @media (min-width: 1040px) { .hs { padding-top: 30px; padding-bottom: 30px; } } /* ---------- deux publics ---------- */ .half.solid p.who { color: #7fc3ee; } .half.wire p.who { color: var(--blue); } .half ul.ticks { padding: 0; } /* ---------- univers ---------- */ .u-row h3 a { color: inherit; text-decoration: none; } .u-row h3 a::after { content: ""; position: absolute; inset: 0; z-index: 1; } .u-go { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; color: var(--blue); } .u-row:hover .u-go::after { transform: translateX(5px); } .u-row .u-img figure { height: 100%; } /* ---------- flux ---------- */ .flux-visual > div { overflow: hidden; } .flux-visual figure img { aspect-ratio: 4 / 5; } .flux-visual .cap { font: 400 .72rem var(--mono); color: var(--muted-dark); padding-top: 10px; } /* ---------- fiche machines ---------- */ .spec { border-top: 1px solid var(--line); } .on-dark .spec { border-top-color: var(--line-dark); } .spec-row { display: grid; grid-template-columns: 38% 1fr; gap: 20px; padding: 18px 0; border-bottom: 1px solid var(--line); } .on-dark .spec-row { border-bottom-color: var(--line-dark); } .spec-k { font: 500 .74rem var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); padding-top: 4px; } .on-dark .spec-k { color: var(--muted-dark); } .spec-n { font: 600 1.35rem/1.1 var(--display); text-transform: uppercase; letter-spacing: .01em; } .spec-d { color: var(--muted); font-size: .95rem; } .on-dark .spec-d { color: var(--muted-dark); } .spec-row.new .spec-n::after { content: "Nouveau"; display: inline-block; margin-left: 10px; vertical-align: middle; font: 500 .62rem/1 var(--mono); letter-spacing: .1em; text-transform: uppercase; background: var(--red); color: #fff; padding: 5px 7px 4px; border-radius: 2px; } .overlap .ov-main img { aspect-ratio: 4 / 3; } /* ---------- histoire ---------- */ .story figure img { filter: none; } .story .bw img { filter: grayscale(1) contrast(1.05); } .story .place { margin: 26px 0 8px; } .link-arrow-p { margin-top: 18px; } .link-arrow-p a { display: inline-flex; align-items: center; gap: .6em; font-weight: 600; text-decoration: none; border-bottom: 1.5px solid currentColor; padding-bottom: 2px; } .link-arrow-p a::after { width: 16px; height: 16px; } /* ---------- pages intérieures ---------- */ .page-hero .crumb a { text-decoration: none; } .wide-photo figure { height: 100%; } .step .big { margin: 0; } .pack-elite { overflow: hidden; } .pack-scanner { margin-right: calc(var(--gutter) * -2); } .pack-scanner img { width: 130%; max-width: none; filter: drop-shadow(0 30px 40px rgba(0, 0, 0, .25)); } .upload.light { background: var(--paper); } .p-img figure { width: 100%; height: 100%; } .p-img img { width: 100%; height: 100%; object-fit: cover; } .p-img.contain img { object-fit: contain; padding: 8%; } .p-tag { font: 500 .78rem var(--mono); letter-spacing: .08em; color: var(--blue); margin-bottom: 14px; } .product .p-name { font: 600 clamp(2.3rem, 5.6vw, 4.6rem)/.92 var(--display); text-transform: uppercase; } .p-figure sup { font-size: .35em; vertical-align: top; margin-left: 4px; } .p-text { color: var(--muted); margin-top: 24px; max-width: 46ch; } .mat .m-sw { display: block; height: 10px; max-width: 220px; margin-top: 6px; font-size: 0; } .sw-st { background: #f4ede0; } .sw-sht { background: linear-gradient(90deg, #f7f2e8 0 33%, #eee2cc 33% 66%, #e4d1b0 66%); } .sw-4d { background: linear-gradient(90deg, #faf6ee, #dcc6a0); } .mat-photo { margin-top: 36px; } .mat-photo img { aspect-ratio: 4 / 3; } .contrast .vs { margin: 0; } .contrast .dl { display: grid; grid-template-columns: auto 1fr; gap: 10px 22px; margin-top: 22px; font-size: .95rem; } .contrast .dt { font: 500 .72rem var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); padding-top: 3px; } .contrast .dd { font-weight: 500; } .chips { margin-top: 26px; } .chips p { border: 1px solid var(--line); border-radius: 999px; padding: 8px 14px; font-weight: 500; font-size: .92rem; background: #fff; } .on-dark .chips p { border-color: var(--line-dark); background: transparent; } .j5-photo img { aspect-ratio: 4 / 5; } .j5 .cap { font: 400 .72rem var(--mono); color: var(--muted); margin-top: 10px; } .j5 h2 + .muted { margin-top: 22px; } .j5 ul.points { border-top-color: var(--line); } .j5 ul.points li { border-bottom-color: var(--line); } .j5 ul.points li strong { font: 500 .78rem var(--mono); color: var(--blue); padding-top: 4px; } .prose p + p { margin-top: 1em; } .proof.one { grid-template-columns: 1fr !important; } /* ---------- contact : Contact Form 7 ---------- */ .form .wpcf7-form { display: grid; gap: 18px; } .form .wpcf7-form-control-wrap { display: block; } .form .field label { display: grid; gap: 8px; font: 500 .74rem var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); } .form .field .wpcf7-form-control:not(.wpcf7-radio) { width: 100%; font: 400 1rem var(--body); color: var(--ink); text-transform: none; letter-spacing: 0; border: 0; border-bottom: 1.5px solid rgba(10, 12, 15, .25); background: transparent; padding: 12px 0; border-radius: 0; outline: none; -webkit-appearance: none; appearance: none; } .form .field select.wpcf7-form-control { background-image: linear-gradient(45deg, transparent 50%, var(--ink) 50%), linear-gradient(135deg, var(--ink) 50%, transparent 50%); background-position: calc(100% - 12px) 55%, calc(100% - 7px) 55%; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 24px; } .form .field .wpcf7-form-control:focus { border-bottom-color: var(--blue); } .form .wpcf7-radio { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; border: 1.5px solid var(--ink); border-radius: 999px; padding: 4px; } .form .wpcf7-radio .wpcf7-list-item { margin: 0; } .form .wpcf7-radio label { display: block; cursor: pointer; } .form .wpcf7-radio input { position: absolute; opacity: 0; pointer-events: none; } .form .wpcf7-radio .wpcf7-list-item-label { display: flex; align-items: center; justify-content: center; min-height: 46px; border-radius: 999px; font: 600 .95rem var(--body); padding: 0 6px; } .form .wpcf7-radio input:checked + .wpcf7-list-item-label { background: var(--ink); color: #fff; } .form .wpcf7-radio input:focus-visible + .wpcf7-list-item-label { outline: 2px solid var(--blue); } .form .btn-submit { display: inline-flex; align-items: center; min-height: 52px; padding: 0 1.6em; border: 0; border-radius: 999px; background: var(--blue); color: #fff; font: 600 1rem var(--body); cursor: pointer; } .form .btn-submit:hover { background: var(--blue-deep); box-shadow: 0 12px 30px rgba(15, 121, 189, .35); } .form .wpcf7-spinner { display: none; } .form .wpcf7-not-valid-tip { color: var(--red); font: 400 .8rem var(--body); text-transform: none; letter-spacing: 0; margin-top: 6px; } .form .wpcf7-response-output { margin: 8px 0 0 !important; padding: 14px 16px !important; border: 0 !important; background: var(--blue-soft); color: var(--blue-deep); font-weight: 500; } .side-in { padding: clamp(28px, 4vw, 44px); } .direct { margin-top: 22px; } .direct .d { position: relative; display: grid; grid-template-columns: 44px 1fr; column-gap: 14px; align-items: center; padding: 22px 0; border-bottom: 1px solid var(--line-dark); } .direct .d::before { content: ""; grid-row: 1 / span 2; width: 44px; height: 44px; border-radius: 50%; background: currentColor; -webkit-mask-size: 20px; mask-size: 20px; } .direct .d-phone::before { background-color: #3fd0e8; } .direct .d-wa::before { background-color: #25d366; } .direct .d-mail::before { background-color: #fff; } .direct .d-pin::before { background-color: #ff5a5c; } .direct .db { font: 600 1.45rem/1.1 var(--display); text-transform: uppercase; letter-spacing: .01em; overflow-wrap: anywhere; } .direct .d-mail .db { font: 600 1.02rem/1.3 var(--body); text-transform: none; } .direct .db a { display: inline; padding: 0; border: 0; text-decoration: none; } .direct .db a::after { content: ""; position: absolute; inset: 0; } .direct .ds { color: var(--muted-dark); font-size: .88rem; } .map .pin { position: absolute; left: 52%; top: 46%; transform: translate(-50%, -100%); font: 500 .72rem var(--mono); color: #fff; background: var(--ink); padding: 5px 8px; white-space: nowrap; } .map .pin::before { content: ""; position: absolute; left: 50%; top: -30px; width: 16px; height: 16px; margin-left: -8px; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 8px rgba(205, 23, 25, .25); } .map .map-link { position: absolute; right: 14px; bottom: 14px; font: 500 .74rem var(--mono); } .map .map-link a { color: #fff; } /* ---------- pied de page ---------- */ .f-logo a { display: inline-flex; align-items: center; gap: 12px; color: #fff; text-decoration: none; font: 700 1.4rem/1 var(--display); letter-spacing: .1em; text-transform: uppercase; } .f-logo a::before { content: ""; width: 56px; height: 56px; background: url("assets/img/ldla-symbole-blanc.png") center / contain no-repeat; } .f-brand > p:not(.f-logo) { color: var(--muted-dark); max-width: 34ch; font-size: .95rem; margin: 18px 0; } .f-col .f-h { font: 500 .72rem var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--muted-dark); margin: 0 0 16px; } .f-col ul { list-style: none; padding: 0; display: grid; gap: 10px; } .f-bottom p a { color: var(--muted-dark); } .mbar p { display: contents; } .mbar .call a::before { background: #3fd0e8; } .mbar .wa a::before { background: #25d366; } @media (min-width: 1040px) { .mbar { display: none; } } .direct .d::before { grid-column: 1; } .direct .d > p { grid-column: 2; min-width: 0; } .map .map-link a { position: static; }