:root{ --bleu:#041E4A; --bleu-2:#0A234F; --bleu-clair:#3D5478; --bleu-3:#0E2D5C; --azur-pale:#EAF2FB; --bleu-gris:#6B7A94; --nuit:#010F38; --nuit-profond:#000A28; --or:#C99028; --or-mat:#A87A2E; --or-clair:#E9D2A5; --or-champagne:#F0E0BC; --or-vif:#DBA83F; --vert:#3E5A4A; --vert-clair:#7C9885; --spark:#E2672C; --spark-2:#F2A65A; --ivoire:#FCFCFC; --lin:#F7F3E9; --coquille:#F1EBDB; --ivoire-2:#F5F2EA; --ivoire-3:#EFEBDF; --gris-texte:#4E5A6B; --gris-chaud:#8A8272; --line:#E4E0D2; --serif:'Fraunces', serif; --sans:'Inter', sans-serif; --script:'Caveat', cursive; --ease:cubic-bezier(.22,1,.36,1); --bounce:cubic-bezier(.34,1.56,.64,1); --header-h:58px; } *{box-sizing:border-box;} html{scroll-behavior:smooth;} body{ margin:0;color:var(--bleu);font-family:var(--sans);-webkit-font-smoothing:antialiased;font-size:16px; background:var(--ivoire); zoom:1.25; background-image: radial-gradient(ellipse 900px 600px at 8% -6%, rgba(201,144,40,.05), transparent 60%), radial-gradient(ellipse 900px 700px at 96% 8%, rgba(4,30,74,.045), transparent 55%), radial-gradient(ellipse 800px 700px at 90% 96%, rgba(62,90,74,.03), transparent 55%); background-attachment:fixed; } @media (max-width:760px){ body{zoom:1;} } .mock-toolbar{ position:sticky;top:0;z-index:40;background:var(--nuit);color:#fff; padding:12px 24px;font-family:var(--sans);font-size:12.5px; display:flex;gap:10px;flex-wrap:wrap;align-items:center; } .mock-toolbar b{font-weight:600;color:var(--or-clair);} .mock-toolbar span{color:#8b93a5;} .tabs{display:flex;gap:6px;flex-wrap:wrap;margin-left:auto;} .tab{padding:6px 14px;border:1px solid #2a3556;border-radius:20px;cursor:pointer;color:#c7cbd6;font-size:12px;} .tab.active{background:var(--or);color:var(--nuit);border-color:var(--or);} .page{display:none;} .page.active{display:block;animation:pagein .5s var(--ease);} @keyframes pagein{from{opacity:0;}to{opacity:1;}} .reveal{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease),transform .8s var(--ease);} .reveal.in{opacity:1;transform:translateY(0);} @media (prefers-reduced-motion: reduce){.reveal{opacity:1;transform:none;transition:none;}} header.site{ padding:10px 56px;display:flex;align-items:center;justify-content:space-between; border-bottom:1px solid var(--line);background:rgba(252,252,252,.92);backdrop-filter:blur(6px); position:sticky;top:0;z-index:20;position:relative;height:var(--header-h);box-sizing:border-box; } header.site::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:linear-gradient(90deg,var(--or) 0%, var(--or-clair) 18%, transparent 40%);} .spark-icon{ display:inline-block;width:13px;height:13px;color:var(--spark); animation:twinkle 3.2s ease-in-out infinite;vertical-align:middle;margin:0 2px; } @keyframes twinkle{0%,100%{transform:scale(1) rotate(0deg);opacity:.85;}50%{transform:scale(1.25) rotate(18deg);opacity:1;}} @media (prefers-reduced-motion: reduce){.spark-icon{animation:none;}} .logo-wrap{display:flex;align-items:center;gap:14px;cursor:pointer;} .logo-wrap img{height:38px;width:auto;transition:transform .5s var(--bounce);} .logo-wrap:hover img{transform:scale(1.06) rotate(-3deg);} .logo-word{font-family:var(--serif);font-weight:500;font-size:18px;letter-spacing:.04em;color:var(--bleu);line-height:1.15;} .logo-word small{display:block;font-family:var(--sans);font-weight:400;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--or);margin-top:3px;} nav.site{display:flex;gap:30px;font-size:12.5px;flex-wrap:wrap;justify-content:flex-end;row-gap:6px;} nav.site a{color:var(--gris-texte);text-decoration:none;position:relative;padding-bottom:5px;transition:color .3s;white-space:nowrap;} nav.site a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--or);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease);} nav.site a:hover{color:var(--bleu);} nav.site a:hover::after{transform:scaleX(1);} @media (max-width:1180px){ header.site{padding:10px 32px;} nav.site{gap:18px;font-size:11.5px;} } @media (max-width:960px){ header.site{padding:10px 20px;flex-wrap:wrap;height:auto;min-height:var(--header-h);} .logo-word{font-size:15px;} .logo-word small{font-size:8px;} .logo-wrap img{height:30px;} nav.site{gap:12px;font-size:10.5px;width:100%;justify-content:flex-start;} .nav-dropdown-menu{min-width:240px;left:0;transform:translateX(0) translateY(6px);} .nav-dropdown:hover .nav-dropdown-menu, .nav-dropdown.open .nav-dropdown-menu{transform:translateX(0) translateY(0);} } @media (max-width:640px){ nav.site{gap:8px;font-size:9.5px;} .logo-word small{display:none;} } .nav-dropdown{position:relative;} .nav-dropdown-menu{ position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(6px); background:var(--ivoire);border:1px solid var(--line);box-shadow:0 22px 44px -20px rgba(4,30,74,.32); min-width:290px;padding:8px 0;z-index:40; opacity:0;pointer-events:none;transition:opacity .25s var(--ease), transform .25s var(--ease); } .nav-dropdown:hover .nav-dropdown-menu{opacity:1;pointer-events:all;transform:translateX(-50%) translateY(0);} .nav-dropdown.open .nav-dropdown-menu{opacity:1;pointer-events:all;transform:translateX(-50%) translateY(0);} .nav-dropdown-menu .ndm-item{ display:flex;align-items:center;justify-content:space-between;gap:10px; padding:10px 18px;font-size:12.5px;color:var(--bleu-2);text-decoration:none;cursor:pointer; border-bottom:1px solid var(--line); } .nav-dropdown-menu .ndm-item:last-child{border-bottom:none;} .nav-dropdown-menu .ndm-item:hover{background:var(--ivoire-2);color:var(--bleu);} .nav-dropdown-menu .ndm-wip{font-family:var(--sans);font-size:8.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--gris-chaud);white-space:nowrap;} .nav-dropdown-menu .ndm-all{ display:block;padding:10px 18px;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase; color:var(--or-mat);text-decoration:none;cursor:pointer; } /* ACCUEIL */ .intro{padding:64px 40px 30px;text-align:center;max-width:820px;margin:0 auto;position:relative;} .intro .ghost-num{ position:absolute;top:-10px;left:50%;transform:translateX(-50%); font-family:var(--serif);font-weight:300;font-size:220px;line-height:1; color:var(--ivoire-3);z-index:0;user-select:none;pointer-events:none;letter-spacing:-.04em; } .intro .kicker{ font-size:12px;letter-spacing:.32em;text-transform:uppercase;color:var(--or); margin-bottom:28px;font-weight:500;position:relative;z-index:1; } .intro h1{ font-family:var(--serif);font-weight:400;font-size:38px;line-height:1.2; color:var(--bleu);margin:0 0 18px;letter-spacing:-.015em;position:relative;z-index:1; } .intro p{font-size:14.5px;line-height:1.65;color:var(--gris-texte);margin:0 auto;max-width:500px;position:relative;z-index:1;} .statement-band{ background:var(--nuit);padding:38px 40px;text-align:center;position:relative;overflow:hidden; background-image:radial-gradient(circle at 15% 25%, rgba(201,144,40,.09), transparent 50%), radial-gradient(circle at 85% 75%, rgba(201,144,40,.06), transparent 50%); } .statement-band::before,.statement-band::after{content:"";position:absolute;left:50%;transform:translateX(-50%);width:64px;height:1px;background:var(--or);} .statement-band::before{top:16px;} .statement-band::after{bottom:16px;} .statement-band p{ font-family:var(--serif);font-style:italic;font-weight:300;font-size:22px;line-height:1.4; color:var(--ivoire);max-width:760px;margin:0 auto;letter-spacing:.005em; } .statement-band p b{font-weight:400;color:var(--or-clair);font-style:normal;} .section-tint{background:var(--ivoire-2);} .accueil-screen2{ max-width:1180px;margin:0 auto;padding:32px 40px 30px; box-sizing:border-box; display:flex;flex-direction:column;gap:22px; } .qui-condense{ display:grid;grid-template-columns:110px 1fr;gap:26px;align-items:center; } .qui-condense .ph{width:110px;height:128px;border-radius:2px;overflow:hidden;position:relative;box-shadow:0 14px 28px -14px rgba(4,30,74,.4);} .qui-condense .ph img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s var(--ease);} .qui-condense .ph:hover img{transform:scale(1.05);} .ph-note{ position:absolute;bottom:-8px;right:-10px;background:var(--spark);color:var(--ivoire); font-family:var(--script);font-size:12px;line-height:1.15;padding:4px 8px 5px; transform:rotate(-4deg);box-shadow:0 6px 12px -4px rgba(226,103,44,.5);z-index:2; } .qui-condense .txt .eyebrow{font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--or);margin-bottom:5px;font-weight:500;} .qui-condense .txt h3{font-family:var(--serif);font-weight:400;font-size:17px;margin:0 0 5px;color:var(--bleu);} .qui-condense .txt p{font-size:12px;line-height:1.5;color:var(--gris-texte);margin:0 0 6px;max-width:600px;} .link-discreet{ font-size:11px;color:var(--bleu);text-decoration:none; border-bottom:1px solid var(--or);padding-bottom:2px;letter-spacing:.02em; transition:color .25s,border-color .25s,padding-right .25s; } .link-discreet:hover{color:var(--or);padding-right:6px;} .portes{ max-width:none;margin:0;padding:0; display:grid;grid-template-columns:repeat(3,1fr);gap:16px; } .porte{ background:var(--ivoire);border:1px solid var(--line);padding:20px 18px 18px;text-align:left; transition:transform .5s var(--bounce),box-shadow .5s var(--ease),border-color .5s var(--ease); cursor:pointer;position:relative;overflow:hidden; } .porte:hover{transform:translateY(-6px) rotate(-.6deg);box-shadow:0 24px 40px -22px rgba(4,30,74,.3);border-color:var(--spark);} .porte:nth-child(2):hover{transform:translateY(-6px) rotate(.6deg);} .porte .roman-ghost{ position:absolute;top:-12px;right:-4px;font-family:var(--serif);font-weight:300;font-size:70px; color:var(--ivoire-3);line-height:1;z-index:0;transition:color .5s var(--ease);user-select:none; } .porte:hover .roman-ghost{color:var(--ivoire-2);} .porte .icon{ width:32px;height:32px;border-radius:50%;border:1px solid var(--or-clair); display:flex;align-items:center;justify-content:center;margin-bottom:10px;position:relative;z-index:1; color:var(--or);transition:background .4s var(--ease),color .4s var(--ease),transform .4s var(--ease); } .porte .icon svg{width:14px;height:14px;} .porte:hover .icon{background:var(--spark);border-color:var(--spark);color:var(--ivoire);transform:rotate(-10deg) scale(1.08);} .porte .roman{font-family:var(--serif);font-size:11px;color:var(--or);letter-spacing:.1em;display:block;margin-bottom:6px;position:relative;z-index:1;} .porte h4{font-family:var(--serif);font-weight:400;font-size:15px;margin:0 0 6px;color:var(--bleu);line-height:1.25;position:relative;z-index:1;} .porte p{font-size:11.5px;color:var(--gris-texte);line-height:1.5;margin:0 0 10px;position:relative;z-index:1;} .porte .go{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--bleu);display:flex;align-items:center;gap:7px;position:relative;z-index:1;} .porte .go svg{width:12px;height:12px;transition:transform .35s var(--ease);} .porte:hover .go svg{transform:translateX(6px);} .discret-prestations{ text-align:center;padding:0;font-size:11.5px;color:var(--gris-texte); } .discret-prestations a{color:var(--bleu);text-decoration:none;border-bottom:1px solid var(--or);} .cta-final{ text-align:left;padding:16px 26px;background:var(--nuit); background-image:radial-gradient(circle at 20% 20%, rgba(201,144,40,.07), transparent 55%); display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap; } .cta-final .kicker{font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--or-clair);margin-bottom:4px;} .cta-final p{font-family:var(--serif);font-weight:400;font-size:17px;color:var(--ivoire);margin:0;letter-spacing:-.005em;} .btn{ display:inline-block;padding:15px 40px;border:1px solid var(--or);border-radius:0; color:var(--or-clair);text-decoration:none;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase; transition:all .35s var(--bounce);position:relative; } .btn:hover{background:var(--spark);border-color:var(--spark);color:var(--ivoire);letter-spacing:.16em;transform:translateY(-3px) scale(1.02);} .btn:active{transform:translateY(0) scale(.98);} .cta-final .btn{padding:9px 20px;font-size:10px;flex-shrink:0;} footer.site{border-top:1px solid var(--line);background:var(--ivoire);} .foot-top{ max-width:1100px;margin:0 auto;padding:38px 40px 24px; display:flex;align-items:center;justify-content:center;gap:0;flex-wrap:wrap; } .foot-item{display:flex;align-items:center;gap:18px;padding:0 34px;} .foot-item .ic{ width:52px;height:52px;border-radius:50%;flex-shrink:0; background:var(--nuit);border:2px solid var(--or); display:flex;align-items:center;justify-content:center;color:var(--ivoire); } .foot-item .ic svg{width:21px;height:21px;} .foot-item .tx{font-size:14.5px;color:var(--bleu);line-height:1.55;} .foot-sep{width:1px;height:44px;background:linear-gradient(180deg, transparent, var(--or) 20%, var(--or) 80%, transparent);} .foot-rule{ max-width:820px;margin:0 auto;padding:0 40px; display:flex;align-items:center;gap:16px; } .foot-rule .line{flex:1;height:1px;background:linear-gradient(90deg, transparent, var(--or-clair));} .foot-rule .line.r{background:linear-gradient(90deg, var(--or-clair), transparent);} .foot-rule .diamond{width:8px;height:8px;background:var(--or);transform:rotate(45deg);flex-shrink:0;} .foot-legal{max-width:700px;margin:0 auto;padding:16px 40px 34px;text-align:center;} .foot-legal p{font-size:12.5px;color:var(--bleu-2);line-height:1.75;margin:0;} .foot-wave{position:relative;height:54px;overflow:hidden;margin-top:6px;} .foot-wave svg{position:absolute;bottom:0;left:0;width:100%;height:100%;} .wave-fill{fill:var(--nuit);} .wave-line{stroke:var(--or);stroke-width:2.5;} /* QUI SUIS-JE */ .qsj-single{max-width:1100px;margin:0 auto;padding:18px 40px 14px;box-sizing:border-box;} .qsj-top{display:grid;grid-template-columns:140px 1fr;gap:24px;align-items:center;margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid var(--line);} .qsj-photo{width:140px;height:160px;overflow:hidden;position:relative;box-shadow:0 16px 32px -16px rgba(4,30,74,.35);} .qsj-photo img{ width:100%;height:100%;object-fit:cover;object-position:top center;display:block; opacity:0;animation:qsj-fadein 1.4s ease .15s forwards; } @keyframes qsj-fadein{from{opacity:0;transform:scale(1.02);}to{opacity:1;transform:scale(1);}} @media (prefers-reduced-motion: reduce){.qsj-photo img{animation:none;opacity:1;}} .qsj-id .eyebrow{font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--or);margin-bottom:8px;font-weight:500;} .qsj-id h1{font-family:var(--serif);font-weight:400;font-size:24px;margin:0 0 8px;color:var(--bleu);line-height:1.15;letter-spacing:-.01em;} .qsj-id .titles{font-size:11.5px;color:var(--gris-texte);line-height:1.6;max-width:520px;margin-bottom:10px;} .qsj-id .intro{font-family:var(--serif);font-style:italic;font-size:13px;line-height:1.5;color:var(--bleu-2);max-width:520px;margin:0;} .qsj-parcours-title{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--or);margin-bottom:10px;text-align:center;} .qsj-parcours-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-bottom:16px;} .qsj-step .n{font-family:var(--serif);font-size:11px;color:var(--or);letter-spacing:.08em;display:block;margin-bottom:5px;} .qsj-step h3{font-family:var(--serif);font-weight:400;font-size:15.5px;color:var(--bleu);margin:0 0 6px;line-height:1.25;} .qsj-step p{font-size:11.5px;line-height:1.55;color:var(--gris-texte);margin:0;} .qsj-journey-divider{height:1px;background:linear-gradient(90deg,transparent, var(--or-clair) 20%, var(--vert-clair) 50%, var(--or-clair) 80%, transparent);margin:0 0 14px;} .qsj-cols h2{font-family:var(--serif);font-weight:400;font-size:16px;color:var(--bleu);margin:0 0 10px;text-align:center;} .qsj-cols-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;} .qsj-cols-grid p{font-size:11.5px;line-height:1.55;color:var(--gris-texte);margin:0;} @media (max-width:900px){ .qsj-parcours-grid,.qsj-cols-grid{grid-template-columns:1fr;} } .foot-mini{ padding:22px 40px;text-align:center; font-size:11px;color:var(--gris-texte);letter-spacing:.02em; } .foot-mini b{color:var(--bleu);font-weight:500;} /* RAISON D'ETRE */ .raison-hero{max-width:780px;margin:0 auto;padding:100px 40px 20px;text-align:center;} .raison-hero .eyebrow{font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--or);margin-bottom:24px;font-weight:500;} .raison-hero h1{font-family:var(--serif);font-weight:400;font-size:44px;margin:0 0 8px;color:var(--bleu);line-height:1.18;letter-spacing:-.01em;} .raison-open{max-width:900px;margin:70px auto 90px;padding:0 40px;text-align:center;position:relative;} .raison-open::before{ content:"";position:absolute;top:-30px;left:50%;transform:translateX(-50%); width:1px;height:60px;background:linear-gradient(180deg, transparent, var(--or)); } .opener-big{ font-family:var(--serif);font-weight:300;font-style:italic;font-size:38px;line-height:1.4; background:linear-gradient(100deg, var(--bleu) 0%, var(--bleu-2) 45%, var(--or-mat) 100%); -webkit-background-clip:text;background-clip:text;color:transparent; margin:0; } .raison-text{max-width:640px;margin:0 auto;padding:0 40px;} .raison-text p{font-size:16.5px;line-height:2.1;color:var(--gris-texte);margin:0 0 30px;} .raison-text p.shift-right{max-width:520px;margin-left:auto;margin-right:0;text-align:left;} .raison-text p.shift-left{max-width:520px;margin-left:0;margin-right:auto;text-align:left;} .raison-text em{font-style:italic;color:var(--bleu-2);} .raison-portrait{ max-width:1020px;margin:90px auto;padding:0 40px; display:grid;grid-template-columns:.8fr 1.2fr;gap:64px;align-items:center; } .raison-portrait .graphic{ position:relative;height:340px;border-radius:2px;overflow:hidden; background: radial-gradient(circle at 26% 22%, rgba(233,210,165,.5), transparent 34%), radial-gradient(circle at 74% 82%, rgba(62,90,74,.38), transparent 48%), conic-gradient(from 200deg, var(--bleu-2), var(--nuit) 32%, var(--nuit-profond) 58%, var(--bleu-2) 100%); box-shadow:0 30px 60px -24px rgba(4,30,74,.35), inset 0 3px 12px rgba(255,255,255,.08), inset 0 -14px 30px rgba(0,0,0,.35); display:flex;align-items:center;justify-content:center; } .raison-portrait .graphic svg{width:86px;height:86px;color:var(--or-clair);opacity:.9;} .raison-portrait .graphic img{width:150px;height:auto;position:relative;z-index:1;filter:drop-shadow(0 10px 20px rgba(0,0,0,.35));} .raison-portrait .graphic .ring{ position:absolute;inset:22px;border:1px solid rgba(233,210,165,.35);border-radius:50%; } .raison-portrait .cap{padding-right:10px;} .raison-portrait .cap .who{font-family:var(--script);font-size:26px;color:var(--spark);margin:0 0 14px;transform:rotate(-1.5deg);display:inline-block;} .raison-portrait .cap p{font-family:var(--serif);font-style:italic;font-weight:400;font-size:19px;line-height:1.7;color:var(--bleu);margin:0;} .raison-flow{position:relative;padding-top:10px;} .raison-flow::before{ content:"";position:absolute;left:50%;margin-left:-336px;top:40px;bottom:40px;width:1px; background:linear-gradient(180deg, transparent, var(--or-clair) 8%, var(--vert-clair) 50%, var(--or-clair) 92%, transparent); z-index:0; } .raison-mark{ position:absolute;left:50%;margin-left:-340px;width:9px;height:9px;border-radius:50%; background:var(--or);box-shadow:0 0 0 4px rgba(201,144,40,.15);z-index:1; } @media (max-width:900px){.raison-flow::before,.raison-mark{display:none;}} .raison-band{background:var(--ivoire-2);padding:2px 0;} .hl{color:var(--spark);font-style:normal;} .quote-ghost{ position:absolute;top:-60px;left:50%;transform:translateX(-50%); font-family:var(--serif);font-size:220px;color:var(--ivoire-3);line-height:1; z-index:0;user-select:none;pointer-events:none; } .conv-teaser{max-width:700px;margin:0 auto;padding:10px 40px 0;position:relative;z-index:1;} .conv-teaser .lbl{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--or);text-align:center;display:block;margin-bottom:22px;} .conv-teaser-row{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;} .conv-chip{ width:52px;height:52px;border-radius:50%;border:1px solid var(--or-clair); display:flex;align-items:center;justify-content:center;background:var(--ivoire); transition:transform .4s var(--bounce), border-color .4s; } .conv-chip svg{width:20px;height:20px;color:var(--or);} .conv-chip:hover{transform:translateY(-5px) scale(1.08);border-color:var(--spark);} .conv-chip:hover svg{color:var(--spark);} @media (max-width:760px){.raison-portrait{grid-template-columns:1fr;}} .raison-pause{max-width:640px;margin:20px auto 70px;padding:0 40px;position:relative;} .raison-pause::before{content:"";position:absolute;left:40px;top:0;bottom:0;width:2px; background:linear-gradient(180deg, var(--or-clair), transparent);} .raison-pause p{ font-family:var(--serif);font-weight:400;font-style:italic;font-size:20px;line-height:1.7; color:var(--bleu);padding-left:36px;margin:0; } .raison-convictions{max-width:760px;margin:90px auto;padding:70px 40px;position:relative;} .raison-convictions .spine{ position:absolute;left:50%;top:20px;bottom:20px;width:1px; background:linear-gradient(180deg, transparent, var(--or-clair) 15%, var(--vert-clair) 50%, var(--or-clair) 85%, transparent); transform:translateX(-50%); } .conv-line{ font-family:var(--serif);font-weight:400;font-style:italic;font-size:19px;line-height:1.6; color:var(--bleu-2);max-width:340px;margin:0 0 46px;position:relative; } .conv-line.al{text-align:right;margin-left:0;margin-right:auto;padding-right:34px;} .conv-line.ar{text-align:left;margin-left:auto;margin-right:0;padding-left:34px;} .conv-line::after{ content:"";position:absolute;top:10px;width:7px;height:7px;border-radius:50%; background:var(--or);box-shadow:0 0 0 4px rgba(201,144,40,.15); } .conv-line.al::after{right:-3.5px;} .conv-line.ar::after{left:-3.5px;} .raison-breath{max-width:600px;margin:100px auto;padding:0 40px;text-align:center;position:relative;} .raison-breath .glow{ position:absolute;top:50%;left:50%;transform:translate(-50%,-50%); width:280px;height:180px;border-radius:50%; background:radial-gradient(ellipse, rgba(201,144,40,.14), transparent 70%); filter:blur(4px);animation:glowpulse 5s ease-in-out infinite;z-index:0; } .raison-breath p{ position:relative;z-index:1; font-family:var(--serif);font-weight:400;font-size:32px;color:var(--bleu);margin:0;letter-spacing:.01em; } .raison-text ul{list-style:none;padding:0;margin:0 0 24px;} .raison-text .closing-wrap{max-width:660px;margin:0 auto;padding:60px 40px 0;text-align:center;position:relative;} .raison-text .closing-wrap .glow2{ position:absolute;top:50%;left:50%;transform:translate(-50%,-50%); width:420px;height:200px;border-radius:50%; background:radial-gradient(ellipse, rgba(62,90,74,.12), rgba(201,144,40,.08) 55%, transparent 75%); filter:blur(6px);animation:glowpulse 6s ease-in-out infinite;z-index:0; } .raison-text .closing{ position:relative;z-index:1; font-family:var(--serif);font-style:italic;font-size:20px;color:var(--bleu);text-align:center;line-height:1.8; } .deming-section{padding:80px 40px 140px;text-align:center;position:relative;overflow:hidden; background:linear-gradient(180deg, var(--ivoire-2) 0%, var(--lin) 100%); } .deming-wheel{position:relative;width:600px;height:600px;margin:0 auto;} .deming-glow{ position:absolute;top:50%;left:50%;transform:translate(-50%,-50%); width:340px;height:340px;border-radius:50%; background:radial-gradient(circle, rgba(201,144,40,.16) 0%, rgba(201,144,40,.05) 45%, transparent 72%); filter:blur(6px);z-index:0;pointer-events:none; animation:glowpulse 5.5s ease-in-out infinite; } @media (prefers-reduced-motion: reduce){.deming-glow{animation:none;}} .deming-center{ position:absolute;top:50%;left:50%;transform:translate(-50%,-50%); width:190px;height:190px;border-radius:50%; background: radial-gradient(circle at 30% 24%, rgba(233,210,165,.5), transparent 32%), radial-gradient(circle at 68% 78%, rgba(62,90,74,.35), transparent 46%), conic-gradient(from 220deg, var(--bleu-2), var(--nuit) 35%, var(--nuit-profond) 60%, var(--bleu-2) 100%); color:var(--ivoire); box-shadow: 0 36px 70px -18px rgba(1,15,56,.6), 0 0 0 1px rgba(233,210,165,.4), inset 0 2px 10px rgba(255,255,255,.08), inset 0 -14px 30px rgba(0,0,0,.35); display:flex;align-items:center;justify-content:center;text-align:center; font-family:var(--serif);font-weight:400;font-size:16px;padding:18px;line-height:1.45;z-index:3; letter-spacing:.01em;animation:demingpulse 5.5s ease-in-out infinite; } @keyframes demingpulse{ 0%,100%{box-shadow:0 36px 70px -18px rgba(1,15,56,.6), 0 0 0 1px rgba(233,210,165,.4), inset 0 2px 10px rgba(255,255,255,.08), inset 0 -14px 30px rgba(0,0,0,.35);} 50%{box-shadow:0 40px 78px -16px rgba(1,15,56,.68), 0 0 0 1px rgba(233,210,165,.6), inset 0 2px 10px rgba(255,255,255,.12), inset 0 -14px 30px rgba(0,0,0,.38);} } @media (prefers-reduced-motion: reduce){.deming-center{animation:none;}} .deming-ring{position:absolute;inset:0;border-radius:50%;pointer-events:none;z-index:1;} .deming-ring .r1{ position:absolute;inset:0;border-radius:50%; border:1px solid transparent; background:conic-gradient(from 0deg, var(--or-clair), var(--or) 25%, var(--or-champagne) 50%, var(--vert-clair) 75%, var(--or-clair) 100%) border-box; -webkit-mask:linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0); -webkit-mask-composite:xor;mask-composite:exclude; opacity:.5;animation:spin 110s linear infinite; } .deming-ring .r1b{position:absolute;inset:0;border:1px solid var(--or-clair);border-radius:50%;opacity:.3;} .deming-ring .r2{position:absolute;inset:44px;border:1px dashed var(--line);border-radius:50%;} @keyframes spin{to{transform:rotate(360deg);}} @media (prefers-reduced-motion: reduce){.deming-ring .r1{animation:none;}} .deming-item{position:absolute;width:184px;text-align:center;z-index:2;animation:float 7s ease-in-out infinite;} @keyframes float{0%,100%{transform:translateY(0);}50%{transform:translateY(-4px);}} @media (prefers-reduced-motion: reduce){.deming-item{animation:none;}} .deming-item .card{ background:linear-gradient(165deg, var(--ivoire) 0%, var(--lin) 100%); border:1px solid var(--line);padding:19px 17px 17px;border-radius:2px; box-shadow:0 14px 30px -18px rgba(4,30,74,.18);position:relative;overflow:hidden; transition:transform .45s var(--ease), box-shadow .45s var(--ease), border-color .45s var(--ease); } .deming-item .card::before{ content:"";position:absolute;top:0;left:0;right:0;height:3px; background:linear-gradient(90deg, var(--or-mat), var(--or-vif) 50%, var(--or-champagne)); transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease); } .deming-item:hover .card{transform:translateY(-8px);box-shadow:0 30px 46px -18px rgba(4,30,74,.32);border-color:var(--or-clair);} .deming-item:hover .card::before{transform:scaleX(1);} .deming-item .n{font-family:var(--serif);font-size:11px;color:var(--or-mat);letter-spacing:.1em;display:block;margin-bottom:9px;} .deming-item .t{font-size:12.5px;line-height:1.55;color:var(--bleu-2);} .deming-spoke{ stroke:url(#demingGrad);stroke-width:1;opacity:.5; stroke-dasharray:5 234;animation:diffuse 4.2s linear infinite; } @media (prefers-reduced-motion: reduce){.deming-spoke{animation:none;}} @keyframes diffuse{to{stroke-dashoffset:-239;}} .deming-item:hover ~ svg .deming-spoke{opacity:.5;} /* SES PROPOSITIONS */ .prop-fit-screen{ padding:16px 20px 10px; display:flex;flex-direction:column;align-items:center; box-sizing:border-box; } .prop-hero{max-width:700px;margin:0 auto;text-align:center;flex-shrink:0;} .prop-hero .eyebrow{font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--or);margin-bottom:8px;font-weight:500;} .prop-hero h1{font-family:var(--serif);font-weight:400;font-size:23px;margin:0 0 6px;color:var(--bleu);line-height:1.15;letter-spacing:-.01em;} .prop-hero p{font-size:12.5px;color:var(--gris-texte);line-height:1.55;max-width:540px;margin:0 auto;} .prop-grid{ max-width:1180px;width:100%;margin:20px auto 0; display:grid;grid-template-columns:repeat(3,1fr);gap:16px; } .prop-card{ position:relative;background:var(--ivoire);border:1px solid var(--line); border-radius:3px;padding:18px 18px 16px;text-align:left;cursor:pointer;overflow:hidden; box-shadow:0 12px 26px -18px rgba(4,30,74,.2); transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s var(--ease); } .prop-card::before{ content:"";position:absolute;left:0;top:0;right:0;height:4px; background:linear-gradient(90deg, var(--c1,var(--or)), var(--c2,var(--or-clair))); } .wip-badge{ position:absolute;top:14px;right:14px;background:var(--ivoire-2);border:1px solid var(--line); font-family:var(--sans);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--gris-chaud); padding:4px 9px;border-radius:20px;z-index:2; } .domain-nav{ display:flex;align-items:stretch;justify-content:space-between;gap:16px; max-width:1040px;margin:0 auto;padding:0 56px 24px; } .domain-nav .dn-link{ flex:1;display:flex;flex-direction:column;gap:4px;padding:14px 18px; background:var(--ivoire-2);border:1px solid var(--line);text-decoration:none; cursor:pointer;transition:border-color .3s var(--ease), transform .3s var(--ease); max-width:320px; } .domain-nav .dn-link:hover{border-color:var(--or-clair);transform:translateY(-2px);} .domain-nav .dn-link.next{align-items:flex-end;text-align:right;margin-left:auto;} .domain-nav .dn-dir{font-family:var(--sans);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--or-mat);display:flex;align-items:center;gap:6px;} .domain-nav .dn-link.next .dn-dir{flex-direction:row-reverse;} .domain-nav .dn-dir svg{width:12px;height:12px;} .domain-nav .dn-title{font-family:var(--serif);font-size:13.5px;color:var(--bleu);line-height:1.35;} .wip-notice{background:var(--lin);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 56px;} .wip-notice p{margin:0;font-size:13px;color:var(--gris-texte);text-align:center;line-height:1.6;} .wip-notice a{color:var(--bleu);border-bottom:1px solid var(--or);text-decoration:none;} .prop-card .icon-wrap{ width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center; margin-bottom:12px;color:#fff; background:linear-gradient(135deg, var(--c1,var(--or)), var(--c2,var(--or-clair))); } .prop-card .icon-wrap svg{width:18px;height:18px;} .prop-card:hover{transform:translateY(-6px);box-shadow:0 24px 40px -18px rgba(4,30,74,.3);border-color:var(--c1,var(--or));} .prop-card .n{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--c1,var(--or-mat));display:block;margin-bottom:6px;font-weight:600;} .prop-card b{display:block;font-family:var(--serif);font-weight:400;font-size:15.5px;color:var(--bleu);line-height:1.3;margin-bottom:7px;} .prop-card .desc{font-size:11.5px;color:var(--gris-texte);line-height:1.55;} .prop-legend2{max-width:640px;margin:6px auto 0;text-align:center;} .prop-legend2 p{font-size:11.5px;color:var(--gris-chaud);} @media (max-width:900px){.prop-grid{grid-template-columns:1fr;}} .prop-legend{max-width:640px;margin:20px auto 0;text-align:center;padding:0 40px;} .prop-legend p{font-size:13px;color:var(--gris-texte);line-height:1.85;} /* PAGE PROCESSUS (niveau 2 direct, plus de sas intermédiaire) */ .card-modal{ position:fixed;inset:0;z-index:100; opacity:0;pointer-events:none;transition:opacity .5s var(--ease); overflow-y:auto;background:var(--ivoire); } .card-modal.open{opacity:1;pointer-events:all;} .card-modal > header.site{position:sticky;top:0;z-index:20;} .card-modal .panel{ position:relative;width:100%;min-height:100%; transform:translateY(16px);transition:transform .5s var(--bounce); } .card-modal.open .panel{transform:translateY(0);} .cm-topbar{ position:sticky;top:var(--header-h);z-index:6;background:var(--ivoire);border-bottom:1px solid var(--line); padding:18px 40px;display:flex;align-items:center;justify-content:space-between; } .cm-back{ display:flex;align-items:center;gap:10px;background:none;border:none;cursor:pointer; font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--bleu);transition:color .3s, gap .3s; } .cm-back:hover{color:var(--spark);gap:16px;} .cm-back svg{width:16px;height:16px;} .cm-close{ width:38px;height:38px;border-radius:50%; background:var(--ivoire);border:1px solid var(--line);color:var(--bleu);cursor:pointer; display:flex;align-items:center;justify-content:center;transition:all .3s var(--ease); } .cm-close:hover{background:var(--spark);border-color:var(--spark);color:#fff;transform:rotate(90deg);} .cm-head{ padding:22px 56px;position:relative;overflow:hidden; display:flex;align-items:center;gap:18px;border-bottom:1px solid var(--line); } .cm-head::before{ content:"";position:absolute;left:0;top:0;bottom:0;width:4px; background:linear-gradient(180deg, var(--c1,var(--or)), var(--c2,var(--or-clair))); } .cm-head .icon-big{ width:44px;height:44px;border-radius:50%;flex-shrink:0; background:linear-gradient(135deg, var(--c1,var(--or)), var(--c2,var(--or-clair))); display:flex;align-items:center;justify-content:center; } .cm-head .icon-big svg{width:20px;height:20px;color:#fff;} .cm-head .n{font-family:var(--sans);font-size:10.5px;color:var(--c1,var(--or-mat));letter-spacing:.12em;text-transform:uppercase;display:block;margin-bottom:3px;font-weight:600;} .cm-head h2{font-family:var(--serif);font-weight:400;font-size:21px;color:var(--bleu);margin:0;line-height:1.2;} .cm-head .hook{display:none;} .cm-question{ max-width:1040px;margin:0 auto;padding:22px 56px 4px; } .cm-question h3{font-family:var(--serif);font-weight:400;font-size:19px;color:var(--bleu);margin:0 0 4px;} .cm-question p{font-size:12.5px;color:var(--gris-texte);margin:0;} .cm-columns{ max-width:1040px;margin:0 auto;padding:30px 56px 20px; display:grid;grid-template-columns:repeat(3,1fr);gap:28px; } .cm-col{background:var(--ivoire-2);border:1px solid var(--line);padding:28px 26px 30px;position:relative;overflow:hidden;} .cm-col::before{content:"";position:absolute;left:0;top:0;right:0;height:3px;} .cm-col .col-icon{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:18px;border:1px solid var(--line);} .cm-col .col-icon svg{width:17px;height:17px;} .cm-col h4{font-family:var(--serif);font-weight:400;font-size:17px;color:var(--bleu);margin:0 0 6px;} .cm-col .col-sub{font-size:11.5px;color:var(--gris-texte);margin:0 0 18px;line-height:1.5;} .cm-col ul{list-style:none;padding:0;margin:0;} .cm-col li{ font-size:13.5px;color:var(--gris-texte);padding:9px 0;border-bottom:1px dotted var(--line); display:flex;align-items:baseline;gap:8px; } .cm-col li:last-child{border-bottom:none;} .cm-col li::before{content:"—";color:var(--or);flex-shrink:0;} .cm-col li a{color:var(--bleu);text-decoration:none;border-bottom:1px solid var(--or-clair);} .cm-col li a:hover{color:var(--spark);border-color:var(--spark);} .cm-col .empty{font-size:12.5px;font-style:italic;color:var(--gris-chaud);line-height:1.7;} .cm-col .empty a{color:var(--bleu);border-bottom:1px solid var(--or);text-decoration:none;} .cahier-teaser{ margin:-28px -26px -30px;padding:32px 26px 28px;position:relative;overflow:hidden; min-height:calc(100% + 58px); background:linear-gradient(155deg, var(--c1,var(--bleu)) 0%, var(--c2,var(--nuit)) 115%); color:#fff;display:flex;flex-direction:column; transition:box-shadow .4s var(--ease); } .cahier-teaser::after{ content:"";position:absolute;top:-40px;right:-40px;width:150px;height:150px;border-radius:50%; background:radial-gradient(circle, rgba(255,255,255,.12), transparent 70%);pointer-events:none; } .cahier-teaser .ct-icon{ width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.35); display:flex;align-items:center;justify-content:center;margin-bottom:18px; transition:transform .4s var(--bounce);position:relative;z-index:1; } .cahier-teaser .ct-icon svg{width:21px;height:21px;color:var(--or-clair);} .cm-col:hover .cahier-teaser .ct-icon{transform:rotate(-8deg) scale(1.08);} .cahier-teaser .ct-kicker{font-family:var(--sans);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.65);margin-bottom:8px;position:relative;z-index:1;} .cahier-teaser .ct-lead{font-family:var(--serif);font-weight:400;font-size:21px;color:#fff;margin-bottom:12px;line-height:1.3;position:relative;z-index:1;} .ct-dom{display:block;font-family:var(--sans);font-size:11px;letter-spacing:.02em;text-transform:none; color:rgba(255,255,255,.9);margin-top:5px;line-height:1.35;font-weight:500;} .cahier-teaser .ct-tags{ font-family:var(--sans);font-size:10.5px;letter-spacing:.04em;color:rgba(255,255,255,.6); margin:0 0 24px;position:relative;z-index:1;flex:1; } .cahier-teaser .ct-cta{ display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:var(--sans); font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:500; color:var(--nuit);background:var(--or-clair);text-decoration:none;padding:13px 18px; transition:background .3s var(--ease), transform .3s var(--ease), box-shadow .3s var(--ease); position:relative;z-index:1; } .cahier-teaser .ct-cta:hover{background:#fff;transform:translateY(-2px);box-shadow:0 10px 22px -8px rgba(0,0,0,.4);} .accomp-teaser{ margin:-28px -26px -30px;padding:32px 26px 28px;position:relative;overflow:hidden; min-height:calc(100% + 58px); background:linear-gradient(155deg, var(--vert-clair) 0%, var(--vert) 65%, var(--nuit) 130%); color:#fff;display:flex;flex-direction:column; } .accomp-teaser::after{ content:"";position:absolute;top:-40px;right:-40px;width:150px;height:150px;border-radius:50%; background:radial-gradient(circle, rgba(255,255,255,.14), transparent 70%);pointer-events:none; } .accomp-teaser .at-icon{ width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.35);position:relative;z-index:1; display:flex;align-items:center;justify-content:center;margin-bottom:18px; transition:transform .4s var(--bounce); } .cm-col:hover .accomp-teaser .at-icon{transform:rotate(8deg) scale(1.08);} .accomp-teaser .at-icon svg{width:21px;height:21px;color:#fff;} .accomp-teaser .at-kicker{font-family:var(--sans);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.65);margin-bottom:10px;position:relative;z-index:1;} .accomp-teaser .at-lead{font-family:var(--serif);font-weight:400;font-size:21px;color:#fff;margin-bottom:12px;line-height:1.3;position:relative;z-index:1;} .accomp-teaser .at-text{font-family:var(--sans);font-size:10.5px;letter-spacing:.04em;line-height:1.7;color:rgba(255,255,255,.6);margin:0 0 24px;flex:1;position:relative;z-index:1;} .accomp-teaser .at-cta{ display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:var(--sans); font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:500; color:var(--nuit);background:#fff;text-decoration:none;padding:13px 18px; transition:background .3s var(--ease), transform .3s var(--ease), box-shadow .3s var(--ease); position:relative;z-index:1; } .accomp-teaser .at-cta:hover{background:var(--or-clair);transform:translateY(-2px);box-shadow:0 10px 22px -8px rgba(0,0,0,.4);} .audit-teaser{ margin:-28px -26px -30px;padding:32px 26px 28px;position:relative;overflow:hidden; min-height:calc(100% + 58px); background:linear-gradient(155deg, var(--bleu-clair) 0%, var(--bleu-2) 60%, var(--nuit) 130%); color:#fff;display:flex;flex-direction:column; } .audit-teaser::after{ content:"";position:absolute;bottom:-40px;left:-30px;width:150px;height:150px;border-radius:50%; background:radial-gradient(circle, rgba(255,255,255,.12), transparent 70%);pointer-events:none; } .audit-teaser .au-icon{ width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.35);position:relative;z-index:1; display:flex;align-items:center;justify-content:center;margin-bottom:18px; transition:transform .4s var(--bounce); } .cm-col:hover .audit-teaser .au-icon{transform:scale(1.1);} .audit-teaser .au-icon svg{width:20px;height:20px;color:#fff;} .audit-teaser .au-kicker{font-family:var(--sans);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.65);margin-bottom:10px;position:relative;z-index:1;} .audit-teaser .au-lead{font-family:var(--serif);font-weight:400;font-size:21px;color:#fff;margin-bottom:12px;line-height:1.3;position:relative;z-index:1;} .audit-teaser .au-text{font-family:var(--sans);font-size:10.5px;letter-spacing:.04em;line-height:1.7;color:rgba(255,255,255,.6);margin:0 0 24px;flex:1;position:relative;z-index:1;} .audit-teaser .au-cta{ display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:var(--sans); font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:500; color:var(--nuit);background:#fff;text-decoration:none;padding:13px 18px; transition:background .3s var(--ease), transform .3s var(--ease), box-shadow .3s var(--ease); position:relative;z-index:1;cursor:pointer; } .audit-teaser .au-cta:hover{background:var(--or-clair);transform:translateY(-2px);box-shadow:0 10px 22px -8px rgba(0,0,0,.4);} /* --- pastille « En construction » : remplace le CTA sur les domaines 2 à 6 --- */ .teaser-wip{ display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:var(--sans); font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:500; color:rgba(255,255,255,.92);background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.34);padding:12px 18px; position:relative;z-index:1;cursor:default; } .teaser-wip::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--wipdot, var(--or-clair));flex:none;} /* halo lumineux supplémentaire, teinté de la couleur d'accent de la carte */ .teaser-glow::before{ content:"";position:absolute;bottom:-70px;left:-55px;width:215px;height:215px;border-radius:50%; background:radial-gradient(circle, var(--glow, rgba(255,255,255,.18)), transparent 72%); pointer-events:none;z-index:0; } .teaser-glow::after{background:radial-gradient(circle, rgba(255,255,255,.20), transparent 70%);} @media (max-width:820px){.cm-columns{grid-template-columns:1fr;}} /* ============================================================ SA RAISON D'ÊTRE — refonte complète : une rencontre, pas un texte ============================================================ */ .ame{position:relative;} /* --- Scène d'ouverture : spirale ascendante + lumière qui circule --- */ .ame-open{ position:relative;min-height:78vh;display:flex;flex-direction:column;align-items:center;justify-content:center; text-align:center;overflow:hidden;padding:80px 40px; } .ame-spiral{position:absolute;inset:0;width:100%;height:100%;z-index:0;opacity:.9;} .ame-spiral path{fill:none;stroke:var(--or-clair);stroke-width:1;opacity:.4;} .ame-dot{offset-rotate:0deg;animation:ame-travel 14s linear infinite;} @keyframes ame-travel{from{offset-distance:0%;}to{offset-distance:100%;}} @media (prefers-reduced-motion: reduce){.ame-dot{animation:none;offset-distance:40%;}} .ame-open .eyebrow{position:relative;z-index:1;font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--or);margin-bottom:28px;font-weight:500;} .ame-open h1{ position:relative;z-index:1;font-family:var(--serif);font-weight:300;font-size:52px;line-height:1.32; color:var(--bleu);margin:0;letter-spacing:-.01em;max-width:760px; } .ame-open .sub{position:relative;z-index:1;margin-top:26px;font-family:var(--serif);font-style:italic;font-size:15px;color:var(--gris-texte);} /* --- Fil conducteur : bande sombre, citation centrale --- */ .ame-thread{ background:var(--nuit);padding:110px 40px;text-align:center;position:relative;overflow:hidden; } .ame-thread::before{ content:"";position:absolute;inset:0; background:radial-gradient(circle at 18% 30%, rgba(201,144,40,.1), transparent 55%), radial-gradient(circle at 85% 75%, rgba(62,90,74,.1), transparent 55%); } .ame-thread .k{position:relative;z-index:1;font-size:11.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--or-clair);margin-bottom:30px;display:block;} .ame-thread p{ position:relative;z-index:1;font-family:var(--serif);font-weight:300;font-size:26px;line-height:1.6; color:var(--ivoire);max-width:820px;margin:0 auto; } .ame-thread p b{font-weight:500;color:var(--or-clair);} /* --- Fragments : lecture qui se découvre, jamais en paragraphes égaux --- */ .ame-fragment{max-width:640px;margin:0 auto;padding:100px 40px;position:relative;} .ame-fragment.tight{padding-top:20px;} .ame-fragment .lead{ font-family:var(--serif);font-weight:400;font-size:25px;line-height:1.55;color:var(--bleu);margin:0 0 20px; } .ame-fragment .support{font-size:15px;line-height:1.9;color:var(--gris-texte);margin:0;max-width:520px;} .ame-fragment.r{text-align:right;margin-left:auto;margin-right:0;} .ame-fragment.r .support{margin-left:auto;} .ame-fragment.c{text-align:center;} .ame-fragment.c .support{margin:0 auto;} .ame-trace{height:90px;position:relative;max-width:640px;margin:0 auto;} .ame-trace svg{width:100%;height:100%;} .ame-trace path{fill:none;stroke:var(--or-clair);stroke-width:1.5;stroke-dasharray:1 10;stroke-linecap:round;} .ame-trace circle{fill:var(--or);} /* --- Constellation des convictions ressenties --- */ .ame-constellation{ max-width:920px;margin:40px auto;padding:60px 40px 90px;position:relative; } .ame-constellation .k{display:block;text-align:center;font-size:11.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--or);margin-bottom:50px;} .ame-const-wrap{position:relative;height:420px;} .ame-const-wrap svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;} .ame-const-wrap .link{stroke:var(--or-clair);stroke-width:.75;opacity:.45;} .ame-node{ position:absolute;transform:translate(-50%,-50%);text-align:center;width:170px; } .ame-node .dot{ width:9px;height:9px;border-radius:50%;background:var(--or);margin:0 auto 12px; box-shadow:0 0 0 5px rgba(201,144,40,.14);transition:transform .4s var(--bounce), box-shadow .4s; } .ame-node span{font-family:var(--serif);font-style:italic;font-size:13.5px;color:var(--bleu-2);line-height:1.4;} .ame-node:hover .dot{transform:scale(1.5);box-shadow:0 0 0 8px rgba(226,103,44,.18);background:var(--spark);} /* --- Rencontre : logo + citation authentique --- */ .ame-meet{ max-width:900px;margin:20px auto 100px;padding:0 40px; display:grid;grid-template-columns:.7fr 1.3fr;gap:56px;align-items:center; } .ame-meet .badge{ height:280px;border-radius:2px;position:relative; background: radial-gradient(circle at 26% 22%, rgba(233,210,165,.5), transparent 34%), radial-gradient(circle at 74% 82%, rgba(62,90,74,.38), transparent 48%), conic-gradient(from 200deg, var(--bleu-2), var(--nuit) 32%, var(--nuit-profond) 58%, var(--bleu-2) 100%); box-shadow:0 30px 60px -24px rgba(4,30,74,.35), inset 0 3px 12px rgba(255,255,255,.08), inset 0 -14px 30px rgba(0,0,0,.35); display:flex;align-items:center;justify-content:center; } .ame-meet .badge img{width:120px;height:auto;filter:drop-shadow(0 10px 20px rgba(0,0,0,.35));} .ame-meet .who{font-family:var(--script);font-size:24px;color:var(--spark);margin:0 0 14px;transform:rotate(-1.5deg);display:inline-block;} .ame-meet p{font-family:var(--serif);font-style:italic;font-weight:400;font-size:18px;line-height:1.75;color:var(--bleu);margin:0;} @media (max-width:760px){.ame-meet{grid-template-columns:1fr;}} /* --- Ramifications : une idée en fait naître une autre --- */ .ame-branch-section{max-width:960px;margin:60px auto;padding:20px 40px 80px;text-align:center;} .ame-branch-section .k{font-size:11.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--or);margin-bottom:10px;display:block;} .ame-branch-section .lead{font-family:var(--serif);font-style:italic;font-size:18px;color:var(--gris-texte);max-width:560px;margin:0 auto 50px;line-height:1.7;} .ame-branches{position:relative;height:340px;} .ame-branches svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;} .ame-branches path{fill:none;stroke:var(--or-clair);stroke-width:1.25;} .ame-branches .trunk{stroke:var(--or);stroke-width:2;} .ame-branch-leaf{ position:absolute;transform:translate(-50%,-50%);width:210px; background:var(--ivoire);border:1px solid var(--line);padding:16px 18px;text-align:left; box-shadow:0 14px 28px -18px rgba(4,30,74,.2);transition:transform .4s var(--ease), box-shadow .4s; } .ame-branch-leaf:hover{transform:translate(-50%,-50%) translateY(-4px);box-shadow:0 22px 36px -18px rgba(4,30,74,.3);} .ame-branch-leaf p{font-family:var(--serif);font-size:14px;line-height:1.5;color:var(--bleu-2);margin:0;} /* --- Souffle "Tout est lié" --- */ .ame-breath{max-width:620px;margin:20px auto 100px;padding:0 40px;text-align:center;position:relative;} .ame-breath .glow{ position:absolute;top:50%;left:50%;transform:translate(-50%,-50%); width:300px;height:190px;border-radius:50%; background:radial-gradient(ellipse, rgba(201,144,40,.14), rgba(62,90,74,.08) 55%, transparent 74%); filter:blur(5px);animation:glowpulse 5.5s ease-in-out infinite;z-index:0; } .ame-breath p.big{position:relative;z-index:1;font-family:var(--serif);font-weight:400;font-size:34px;color:var(--bleu);margin:0 0 20px;} .ame-breath p.small{position:relative;z-index:1;font-size:15px;line-height:1.85;color:var(--gris-texte);margin:0 auto;max-width:480px;} /* --- Clôture --- */ .ame-close{max-width:660px;margin:0 auto;padding:0 40px 90px;text-align:center;position:relative;} .ame-close .glow2{ position:absolute;top:50%;left:50%;transform:translate(-50%,-50%); width:420px;height:200px;border-radius:50%; background:radial-gradient(ellipse, rgba(62,90,74,.12), rgba(201,144,40,.08) 55%, transparent 75%); filter:blur(6px);animation:glowpulse 6s ease-in-out infinite;z-index:0; } .ame-close p{position:relative;z-index:1;font-family:var(--serif);font-style:italic;font-size:20px;color:var(--bleu);line-height:1.8;margin:0;} @media (max-width:700px){ .ame-open h1{font-size:36px;} .ame-thread p{font-size:20px;} .ame-const-wrap{height:auto;} .ame-node{position:relative;transform:none;margin:0 auto 30px;left:auto !important;top:auto !important;} .ame-const-wrap svg{display:none;} .ame-branches{height:auto;} .ame-branch-leaf{position:relative;transform:none !important;margin:0 auto 16px;left:auto !important;top:auto !important;} .ame-branches svg{display:none;} } .contact-hero{max-width:780px;margin:0 auto;padding:34px 40px 4px;text-align:center;} .contact-hero .eyebrow{font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--or);margin-bottom:10px;font-weight:500;} .contact-hero h1{font-family:var(--serif);font-weight:400;font-size:28px;margin:0 0 6px;color:var(--bleu);line-height:1.18;letter-spacing:-.01em;} .contact-hero p{font-size:13px;color:var(--gris-texte);} .contact-grid{ max-width:1040px;margin:24px auto 30px;padding:0 40px; display:grid;grid-template-columns:1fr 1.3fr;gap:60px; } .contact-coord .logo-mini{height:32px;margin-bottom:16px;} .contact-coord .item{margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--line);} .contact-coord .item .lbl{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--or);margin-bottom:6px;display:block;} .contact-coord .item .val{font-size:14px;color:var(--bleu);line-height:1.55;} .contact-coord .legal{font-size:11px;color:var(--gris-texte);line-height:1.6;margin-top:16px;} .contact-form label{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--or);margin-bottom:6px;} .contact-form .field{margin-bottom:12px;} .contact-form input, .contact-form textarea{ width:100%;border:none;border-bottom:1px solid var(--line);background:transparent; padding:8px 2px;font-family:var(--sans);font-size:14px;color:var(--bleu); transition:border-color .35s; } .contact-form input:focus, .contact-form textarea:focus{outline:none;border-color:var(--or);} .contact-form textarea{resize:vertical;min-height:52px;} .contact-form .btn{margin-top:8px;border-color:var(--bleu);color:var(--bleu);} .contact-form .btn:hover{background:var(--bleu);color:var(--ivoire);} /* ============================================================ SA RAISON D'ÊTRE — une seule page : texte + roue des convictions Budget : écran 1366×768, en-tête = var(--header-h) ============================================================ */ .syn-screen{ display:grid;grid-template-columns:1fr .9fr; align-items:center;gap:40px;padding:30px 56px 24px;max-width:1300px;margin:0 auto; box-sizing:border-box; } .syn-col-text .eyebrow{font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--or);margin-bottom:12px;font-weight:500;} .syn-col-text h1{font-family:var(--serif);font-weight:300;font-size:29px;line-height:1.18;color:var(--bleu);margin:0 0 12px;letter-spacing:-.01em;} .syn-lead{font-family:var(--serif);font-style:italic;font-size:14.5px;line-height:1.45;color:var(--bleu-2);margin:0 0 12px;max-width:460px;} .syn-sub{font-size:12.5px;line-height:1.55;color:var(--gris-texte);margin:0 0 12px;max-width:440px;} .syn-close-inline{font-size:12px;line-height:1.55;color:var(--gris-chaud);font-style:italic;margin:0;max-width:440px;padding-top:10px;border-top:1px solid var(--line);} .syn-col-visual{position:relative;display:flex;align-items:center;justify-content:center;height:clamp(260px, 38vw, 520px);--wheel-size:clamp(240px, 34vw, 480px);} .deming-section.compact{ padding:0;position:relative;margin:0 auto; width:var(--wheel-size);height:var(--wheel-size); } .deming-section.compact .deming-wheel{ position:absolute;top:50%;left:50%;transform-origin:center;margin:0; transform:translate(-50%,-50%) scale(calc(var(--wheel-size) / 1px / 600)); } @media (max-width:900px){ .syn-screen{grid-template-columns:1fr;height:auto;max-height:none;padding:40px 32px;} .syn-col-visual{height:clamp(220px, 55vw, 320px);max-height:none;--wheel-size:clamp(200px, 50vw, 300px);} } /* ============================================================ CAHIER D'EXPERTISE — expérience Formations d'un domaine ============================================================ */ .cahier-topbar{ position:sticky;top:0;z-index:6;background:var(--ivoire);border-bottom:1px solid var(--line); padding:14px 40px;display:flex;align-items:center;justify-content:space-between; } .cahier-back{display:flex;align-items:center;gap:9px;background:none;border:none;cursor:pointer; font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--bleu);} .cahier-back:hover{color:var(--spark);} .cahier-back svg{width:15px;height:15px;} .cahier-cover{ padding:20px 44px 22px;position:relative;overflow:hidden;color:#fff; background:linear-gradient(135deg, var(--c1,var(--bleu)), var(--c2,var(--nuit)) 130%); } /* bandeau raccourci : on ne garde que la collection, le numéro et le titre */ .cahier-cover .collection2, .cahier-cover .sous, .cahier-cover .identite, .cahier-cover .kw{display:none;} /* --- sélecteur de prestation dans la barre supérieure --- */ .cahier-switch{display:flex;gap:6px;flex-wrap:wrap;} .cahier-switch .cs-tab{ font-family:var(--sans);font-size:11px;letter-spacing:.09em;text-transform:uppercase; background:none;border:1px solid var(--line);color:var(--bleu); padding:7px 14px;cursor:pointer;transition:all .25s var(--ease); } .cahier-switch .cs-tab:hover{border-color:var(--or);color:var(--spark);} .cahier-switch .cs-tab.on{ background:var(--bleu);border-color:var(--bleu);color:var(--ivoire);cursor:default; } .cahier-switch .cs-tab.on:hover{color:var(--ivoire);} /* --- lien "demander un devis" dans les listes --- */ .cahier-form-row a.fd-devis{ color:var(--bleu-2);text-decoration:none;border-bottom:1px solid var(--or-clair); transition:color .25s var(--ease), border-color .25s var(--ease); } .cahier-form-row a.fd-devis:hover{color:var(--spark);border-color:var(--spark);} /* --- bloc dépliable "Notre approche", placé après le catalogue --- */ .cahier-approche{max-width:900px;margin:0 auto 60px;padding:0 40px;} .cahier-approche .ca-toggle{ width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px; background:none;border:none;border-top:1px solid var(--line);cursor:pointer; padding:18px 4px;text-align:left; } .cahier-approche .ca-label{ font-family:var(--sans);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--bleu); } .cahier-approche .ca-sign{ font-family:var(--serif);font-size:20px;line-height:1;color:var(--or);flex-shrink:0; } .cahier-approche .ca-toggle:hover .ca-label{color:var(--spark);} .cahier-approche .ca-body{display:none;} .cahier-approche.open .ca-body{display:block;} .cahier-approche .cahier-editorial{max-width:none;margin:0;padding:6px 0 10px;} @media (max-width:680px){ .cahier-topbar{flex-wrap:wrap;gap:8px;padding-top:10px;padding-bottom:10px;} .cahier-switch{width:100%;gap:5px;} .cahier-switch .cs-tab{flex:1;text-align:center;font-size:10px;padding:6px 4px;letter-spacing:.04em;} .cahier-approche{padding:0 20px;margin-bottom:40px;} } .cahier-cover .collection{font-family:var(--sans);font-size:10.5px;letter-spacing:.28em;text-transform:uppercase;color:rgba(255,255,255,.75);} .cahier-cover .collection2{font-family:var(--sans);font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-top:3px;} .cahier-cover .num{font-family:var(--sans);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-top:3px;} .cahier-cover h1{font-family:var(--serif);font-weight:300;font-size:25px;line-height:1.25;color:#fff;margin:7px 0 0;max-width:780px;} .cahier-cover .sous{font-family:var(--serif);font-style:italic;font-size:16.5px;color:var(--or-clair);max-width:560px;line-height:1.65;margin:0 0 18px;} .cahier-cover .identite{ font-family:var(--serif);font-style:italic;font-weight:400;font-size:15px;color:rgba(255,255,255,.92); max-width:480px;line-height:1.6;margin:0 0 6px;padding-left:18px; border-left:2px solid rgba(255,255,255,.4); } .cahier-cover .kw{font-family:var(--sans);font-size:10.5px;letter-spacing:.05em;color:rgba(255,255,255,.7);} .cahier-cover .kw span{margin-right:14px;} .cahier-editorial{max-width:900px;margin:0 auto;padding:44px 44px 6px;} .cahier-editorial h2{font-family:var(--serif);font-weight:400;font-size:23px;color:var(--bleu);margin:0 0 6px;} .cahier-editorial .rule{width:36px;height:2px;background:var(--or);margin:0 0 16px;} .cahier-editorial p{font-size:15px;line-height:1.85;color:var(--gris-texte);margin:0 0 16px;text-align:justify;} .cahier-signature{display:flex;gap:8px;margin:18px 0;flex-wrap:wrap;} .cahier-signature .step{flex:1;min-width:120px;text-align:center;background:var(--nuit);color:var(--ivoire); font-family:var(--sans);font-size:11px;padding:14px 8px;position:relative;} .cahier-signature .step .n{display:block;font-family:var(--serif);font-size:17px;color:var(--or-clair);margin-bottom:5px;} .cahier-catalog{max-width:900px;margin:20px auto 0;padding:20px 40px 60px;} .cahier-suite{ margin-top:26px;padding:22px 4px 0;border-top:1px solid var(--line); display:flex;align-items:baseline;gap:18px; } .cahier-suite .cs-dots{ font-family:var(--serif);font-size:30px;line-height:.7;color:var(--or);flex-shrink:0; letter-spacing:.08em; } .cahier-suite p{font-size:14px;line-height:1.75;color:var(--gris-texte);margin:0;font-style:italic;} .cahier-suite a{color:var(--bleu);text-decoration:none;border-bottom:1px solid var(--or);font-style:normal;} .cahier-suite a:hover{color:var(--spark);border-color:var(--spark);} @media (max-width:680px){ .cahier-suite{gap:12px;padding-top:18px;} .cahier-suite .cs-dots{font-size:24px;} .cahier-suite p{font-size:13px;} } .cahier-cat{margin-bottom:30px;} .cahier-cat-title{font-family:var(--serif);font-weight:400;font-size:18.5px;color:var(--bleu); border-bottom:1px solid var(--or-clair);padding-bottom:8px;margin-bottom:4px;} .cahier-form-row{ display:flex;align-items:center;justify-content:space-between;gap:16px; padding:14px 4px;border-bottom:1px dotted var(--line);cursor:pointer;transition:padding-left .3s var(--ease); } .cahier-form-row:hover{padding-left:10px;background:var(--ivoire-2);} .cahier-form-row .ft{font-size:15.5px;color:var(--bleu-2);} .cahier-form-row .fd{font-family:var(--sans);font-size:10.5px;color:var(--or-mat);letter-spacing:.04em;white-space:nowrap;flex-shrink:0;} .fiche-modal{position:fixed;inset:0;z-index:150;opacity:0;pointer-events:none;transition:opacity .4s var(--ease);overflow-y:auto;background:var(--ivoire);} .fiche-modal.open{opacity:1;pointer-events:all;} .fiche-topbar{position:sticky;top:0;z-index:6;background:var(--ivoire);border-bottom:1px solid var(--line); padding:14px 40px;display:flex;align-items:center;justify-content:space-between;} .fiche-head{padding:30px 56px;border-bottom:1px solid var(--line);} .fiche-tag2{font-family:var(--sans);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--or);margin-bottom:9px;} .fiche-titre2{font-family:var(--serif);font-weight:400;font-size:29px;color:var(--bleu);line-height:1.25;margin:0 0 10px;} .fiche-accroche2{font-family:var(--serif);font-style:italic;font-size:16.5px;color:var(--bleu-2);} .fiche-body{max-width:900px;margin:0 auto;padding:36px 56px 80px;} .fiche-mod{margin:16px 0 30px;} .fiche-mod-head{display:flex;align-items:center;gap:12px;margin-bottom:20px;} .fiche-mod-head .rule{flex:1;height:1px;background:var(--line);} .fiche-mod-head .label{font-family:var(--sans);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--or-mat);white-space:nowrap;} .fiche-mod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px 28px;} .fiche-mod-item .ic{width:24px;height:24px;color:var(--or-mat);margin-bottom:9px;} .fiche-mod-item .ic svg{width:100%;height:100%;} .fiche-mod-item .lbl{font-family:var(--sans);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--gris-chaud);margin-bottom:5px;} .fiche-mod-item .val{font-size:13.5px;color:var(--bleu-2);line-height:1.65;} .cahier2-modal .fiche-mod-head .label{color:var(--vert);} .cahier2-modal .fiche-mod-item .ic{color:var(--vert);} @media (max-width:820px){.fiche-mod-grid{grid-template-columns:1fr 1fr;} .fiche-2col{grid-template-columns:1fr;}} @media (max-width:600px){.fiche-mod-grid{grid-template-columns:1fr;}} .fiche-fil{font-family:var(--sans);font-size:13.5px;color:var(--bleu);background:var(--coquille);padding:13px 18px;margin:8px 0 26px;text-align:center;} .fiche-fil b{color:var(--or-mat);} .fiche-body h3{font-family:var(--serif);font-weight:400;font-size:19.5px;color:var(--bleu);margin:30px 0 12px;} .fiche-body p{font-size:15px;line-height:1.85;color:var(--gris-texte);margin:0 0 12px;text-align:justify;} .fiche-body ul{margin:0 0 10px;padding-left:20px;} .fiche-body li{font-size:15px;line-height:1.8;color:var(--gris-texte);margin-bottom:8px;text-align:justify;} .fiche-prog-block{margin-bottom:14px;} .fiche-prog-block .pt{font-family:var(--serif);font-size:17px;color:var(--bleu);margin-bottom:8px;} .fiche-2col{display:grid;grid-template-columns:1fr 1fr;gap:30px;} .fiche-2col h3{min-height:52px;line-height:1.3;} @media (max-width:820px){.fiche-2col{grid-template-columns:1fr;}} /* ============================================================ CAHIER 2 — Parcours d'accompagnement (identité vert/humain) ============================================================ */ .cahier2-cover{background:linear-gradient(135deg, var(--vert) 0%, var(--nuit) 130%);} .cahier2-signature .step{background:var(--vert);} .cahier2-signature .step .n{color:var(--vert-clair);} .cahier2-modal .fiche-head{border-bottom-color:var(--line);} .cahier2-modal .fiche-tag2{color:var(--vert);} .aide2-box, .question2-box, .vigilance2-box{ font-size:14px;line-height:1.7;padding:16px 20px;margin:14px 0 24px;color:var(--bleu-2); } .aide2-box{font-family:var(--serif);font-style:italic;font-size:16px;color:var(--vert);background:var(--coquille);text-align:center;} .aide2-box b{display:block;font-style:normal;font-family:var(--sans);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--or-mat);margin-bottom:8px;} .question2-box{background:var(--lin);border-left:3px solid var(--or);} .question2-box b{display:block;font-family:var(--sans);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--or-mat);margin-bottom:6px;} .vigilance2-box{background:#EEF2ED;border-left:3px solid var(--vert);} .vigilance2-box b{display:block;font-family:var(--sans);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--vert);margin-bottom:6px;} .mouvement2-row{display:flex;gap:8px;margin:14px 0 28px;flex-wrap:wrap;} .mouvement2-row .mv-step{ flex:1;min-width:100px;text-align:center;background:var(--vert);color:#fff; font-family:var(--sans);font-size:11.5px;letter-spacing:.03em;padding:14px 8px; } .mouvement2-row .mv-step .n{display:block;font-family:var(--serif);font-size:18px;color:var(--or-clair);margin-bottom:5px;} #fiche2Situation, #fiche2Regardons, #fiche2Reste{list-style:none;padding:0;margin:0 0 8px;} #fiche2Situation li, #fiche2Regardons li, #fiche2Reste li{ font-size:15px;line-height:1.8;color:var(--gris-texte);margin-bottom:8px;padding-left:18px;position:relative;text-align:justify; } #fiche2Situation li::before, #fiche2Regardons li::before, #fiche2Reste li::before{ content:"";position:absolute;left:0;top:10px;width:8px;height:1.5px;background:var(--vert-clair); } /* ============================================================ ACTUALITÉS ============================================================ */ .actu-hero{max-width:760px;margin:0 auto;padding:52px 40px 8px;text-align:center;} .actu-hero .eyebrow{font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--or);margin-bottom:14px;font-weight:500;} .actu-hero h1{font-family:var(--serif);font-weight:400;font-size:32px;margin:0 0 12px;color:var(--bleu);} .actu-hero p{font-size:14.5px;color:var(--gris-texte);line-height:1.75;} .actu-grid{ max-width:1080px;margin:34px auto 0;padding:0 40px; display:grid;grid-template-columns:repeat(5,1fr);gap:16px; } .actu-cat{ background:var(--ivoire);border:1px solid var(--line);padding:22px 14px;text-align:center; transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s var(--ease); } .actu-cat:hover{transform:translateY(-5px);box-shadow:0 20px 36px -22px rgba(4,30,74,.28);border-color:var(--or-clair);} .actu-cat .ac-icon{ width:38px;height:38px;border-radius:50%;border:1px solid var(--or-clair);color:var(--or); display:flex;align-items:center;justify-content:center;margin:0 auto 12px; } .actu-cat .ac-icon svg{width:17px;height:17px;} .actu-cat .ac-label{font-size:12px;color:var(--bleu-2);line-height:1.4;} .actu-empty{max-width:560px;margin:44px auto 60px;text-align:center;} .actu-empty p{font-family:var(--serif);font-style:italic;font-size:15px;color:var(--gris-texte);line-height:1.7;margin:0 0 14px;} @media (max-width:900px){.actu-grid{grid-template-columns:repeat(2,1fr);}} /* ============================================================ CAHIER 3 — Audit, diagnostic, conseil (identité bleu/azur) ============================================================ */ .cahier3-cover{background:linear-gradient(135deg, var(--bleu-clair) 0%, var(--nuit) 130%);} .cahier3-signature .step{background:var(--bleu-2);flex:1;min-width:90px;} .cahier3-signature .step .n{color:var(--or-clair);} .cahier3-modal .fiche-tag2{color:var(--bleu-clair);} .cahier3-modal .fiche-mod-head .label{color:var(--bleu-2);} .cahier3-modal .fiche-mod-item .ic{color:var(--bleu-2);} .situation3-box, .vigilance3-box, .prolongements3{font-size:14px;line-height:1.7;padding:16px 20px;margin:14px 0 20px;color:var(--bleu-2);} .situation3-box{background:var(--coquille);border-left:3px solid var(--or);} .situation3-box b{display:block;font-family:var(--sans);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--or-mat);margin-bottom:6px;} .vigilance3-box{background:#EEF1F6;border-left:3px solid var(--bleu-2);} .vigilance3-box b{display:block;font-family:var(--sans);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--bleu-2);margin-bottom:6px;} .prolongements3{padding:0;margin-top:10px;font-size:12.5px;color:var(--gris-chaud);} .prolongements3 b{font-family:var(--sans);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--bleu-2);} #fiche3Quand li, #fiche3Propose li, #fiche3Obtient li{ font-size:15px;line-height:1.8;color:var(--gris-texte);margin-bottom:8px;padding-left:18px;position:relative;text-align:justify;list-style:none; } #fiche3Quand li::before, #fiche3Propose li::before, #fiche3Obtient li::before{ content:"";position:absolute;left:0;top:10px;width:8px;height:1.5px;background:var(--bleu-clair); } #fiche3Quand, #fiche3Propose, #fiche3Obtient{list-style:none;padding:0;margin:0 0 8px;} .fiche3-step{margin-bottom:14px;} .fiche3-step .st{font-family:var(--serif);font-size:16px;color:var(--bleu);margin-bottom:5px;} .fiche3-step .sd{font-size:13.5px;color:var(--gris-texte);line-height:1.65;} /* ============================================================ OPTIMISATION MOBILE — navigateurs les plus courants ============================================================ */ @media (max-width:680px){ body{font-size:15px;} .logo-word{font-size:14px;} .logo-word small{display:none;} .logo-wrap img{height:28px;} header.site{padding:8px 16px;} /* Accueil */ .intro{padding:36px 20px 24px;} .intro h1{font-size:26px;} .intro p{font-size:14px;max-width:100%;} .statement-band{padding:26px 20px;} .statement-band p{font-size:17px;} .accueil-screen2{padding:20px 18px;} .qui-condense{grid-template-columns:84px 1fr;gap:14px;} .qui-condense .ph{width:84px;height:100px;} .portes{grid-template-columns:1fr;gap:14px;} .cta-final{flex-direction:column;align-items:flex-start;text-align:left;padding:16px 18px;} .cta-final .btn{width:100%;text-align:center;} /* Sa raison d'être */ .syn-screen{padding:24px 20px 18px;gap:20px;} .syn-col-text h1{font-size:23px;} /* Qui suis-je */ .qsj-single{padding:20px 20px 16px;} .qsj-top{grid-template-columns:90px 1fr;gap:16px;padding-bottom:16px;margin-bottom:16px;} .qsj-photo{width:90px;height:108px;} .qsj-id h1{font-size:19px;} .qsj-parcours-grid, .qsj-cols-grid{grid-template-columns:1fr;gap:18px;} /* Ses propositions */ .prop-fit-screen{padding:20px 16px;} .prop-hero h1{font-size:20px;} .prop-grid{gap:12px;} .prop-card{padding:16px 14px 14px;} /* Panneau domaine d'expertise */ .cm-head{padding:24px 20px;} .cm-head h2{font-size:22px;} .cm-topbar{padding:12px 16px;} .cm-question{padding:0 20px;} .cm-columns{padding:0 20px 20px;gap:16px;} .domain-nav{padding:0 20px 18px;flex-direction:column;} .domain-nav .dn-link{max-width:none;} .domain-nav .dn-link.next{align-items:flex-start;text-align:left;margin-left:0;} .domain-nav .dn-link.next .dn-dir{flex-direction:row;} .wip-notice{padding:12px 20px;} /* Cahiers (1, 2, 3) */ .cahier-cover{padding:16px 20px 18px;} .cahier-cover h1{font-size:19px;} .cahier-cover .sous, .cahier-cover .identite{font-size:13px;max-width:100%;} .cahier-editorial{padding:26px 20px 4px;} .cahier-editorial h2{font-size:19px;} .cahier-signature{flex-direction:column;} .cahier-catalog{padding:14px 20px 40px;} .cahier-form-row{padding:12px 2px;} .fiche-head, .fiche-body, .cahier-topbar, .fiche-topbar{padding-left:20px;padding-right:20px;} .fiche-titre2{font-size:22px;} .fiche-kv, .fiche-mod-grid{grid-template-columns:1fr;} .fiche-2col{grid-template-columns:1fr;} .accomp-teaser, .audit-teaser, .cahier-teaser{padding:22px 18px 20px;} /* Contact */ .contact-hero{padding:32px 20px 6px;} .contact-hero h1{font-size:24px;} .contact-grid{grid-template-columns:1fr;gap:32px;padding:0 20px;} /* Actualités */ .actu-hero{padding:32px 20px 6px;} .actu-hero h1{font-size:24px;} .actu-grid{grid-template-columns:repeat(2,1fr);padding:0 20px;gap:12px;} /* Touche : cibles tactiles confortables */ .tab, nav.site a, .cahier-form-row, .btn, .porte, .prop-card{min-height:auto;} .dn-link, .ct-cta, .at-cta, .au-cta, .btn{padding-top:14px;padding-bottom:14px;} } @media (max-width:420px){ .actu-grid{grid-template-columns:1fr;} .qui-condense{grid-template-columns:1fr;} .qui-condense .ph{width:100%;height:180px;} .qsj-top{grid-template-columns:1fr;justify-items:center;text-align:center;} .qsj-photo{width:120px;height:144px;} } @media (max-width:680px){ html, body{overflow-x:hidden;} } /* ============================================================ AJOUTS DE MISE EN PRODUCTION (formulaire de contact réel, liens légaux, pages annexes) Aucun style existant n'a été modifié : tout est ajouté ici. ============================================================ */ /* -- le bouton d'envoi devient un vrai