/* Page Financement - CSS portee depuis la maquette, scopee sous .fin-page. Genere par scripts de build ; ne pas editer a la main sans regenerer. Fonts fournies par le site (Onest/Tektur/Salted) : @font-face retire. */ /* ========================================================================== Revolucy — Page « Financer votre outil sur mesure » base.css : fonts, tokens, rails fluides, typographie, nav, boutons, footer Reproduit fidèlement le design system Revolucy (charte oct. 2024). ========================================================================== */ /* ---------- FONTS ---------- */ /* ---------- TOKENS ---------- */ .fin-page{--color-grey-100:#e6ecff;--color-grey-200:#c9d1e8;--dur:240ms;--container:1320px;--grad-purple-pink:linear-gradient(82deg,var(--color-purple) 10.62%,var(--color-pink) 96.51%);--grad-blue-pink-text:linear-gradient(81deg,var(--color-blue) 10.62%,var(--color-pink) 96.51%);--grad-panel:linear-gradient(180deg,var(--color-blue) 0%,var(--color-black) 100%);} /* ---------- RESET / BASE ---------- */ @media (prefers-reduced-motion:reduce){ } .fin-page img{max-width:100%;display:block;} .fin-page a{color:var(--color-blue);text-decoration:none;transition:color var(--dur) var(--revo-ease);} .fin-page a:hover{color:var(--color-pink);} .fin-page h1, .fin-page h2, .fin-page h3, .fin-page h4{font-family:var(--font-tektur);color:var(--color-blue);letter-spacing:1px;line-height:1.15;font-weight:700;margin:0;text-wrap:balance;} .fin-page p{margin:0 0 1em;text-wrap:pretty;} .fin-page ul{margin:0;padding:0;list-style:none;} /* ---------- RAILS FLUIDES (alignés menu + footer) ---------- */ /* .container = largeur canonique du site (1320px, REVO-308). Blocs de texte long : --container-narrow. */ .fin-page .container{width:95%;max-width:var(--container);margin:auto;} .fin-page .container-narrow{width:95%;max-width:var(--container-narrow);margin:auto;} .fin-page .container-tight{width:95%;max-width:900px;margin:auto;} /* ---------- TYPO UTILS ---------- */ .fin-page .font-tektur-medium{font-family:var(--font-tektur);font-weight:500;} .fin-page .font-tektur-semibold{font-family:var(--font-tektur);font-weight:600;} .fin-page .font-tektur-bold{font-family:var(--font-tektur);font-weight:700;} .fin-page .font-tektur-black{font-family:var(--font-tektur);font-weight:900;} .fin-page .font-onest-regular{font-family:var(--font-onest);font-weight:400;} .fin-page .font-onest-medium{font-family:var(--font-onest);font-weight:500;} .fin-page .font-onest-semibold{font-family:var(--font-onest);font-weight:600;} .fin-page .font-salted{font-family:var(--font-salted);font-weight:400;text-transform:uppercase;} .fin-page .text-large{font-size:var(--display-5);line-height:1.1;} .fin-page .text-semi-large{font-size:var(--display-6);line-height:1.1;} .fin-page .text-medium{font-size:var(--display-7);line-height:1.15;} .fin-page .text-small{font-size:var(--fs-1);line-height:1.2;} .fin-page .text-xsmall{font-size:var(--fs-2);} .fin-page .text-xxsmall{font-size:var(--fs-4);} .fin-page .text-xxxsmall{font-size:var(--fs-6);} .fin-page .color-blue{color:var(--color-blue)!important;} .fin-page .color-blue-deep{color:var(--color-black)!important;} .fin-page .color-green{color:var(--color-green)!important;} .fin-page .color-pink{color:var(--color-pink)!important;} .fin-page .color-purple{color:var(--color-purple)!important;} .fin-page .color-white{color:var(--color-white)!important;} .fin-page .color-grey{color:var(--color-dark-grey)!important;} .fin-page .text-uppercase{text-transform:uppercase;} .fin-page .text-gradient-blue-pink{background:var(--grad-blue-pink-text);-webkit-background-clip:text;background-clip:text;color:transparent;} .fin-page .text-gradient-purple-pink{background:var(--grad-purple-pink);-webkit-background-clip:text;background-clip:text;color:transparent;} /* mix typographique : mot d'accent Tektur dans une phrase Onest */ .fin-page .rvl-emph{font-family:var(--font-tektur);font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--color-blue);} .fin-page .rvl-emph--rose{color:var(--color-pink);} .fin-page .rvl-emph--green{color:var(--color-green);} /* ---------- TAG / SURTITRE ---------- */ .fin-page .tag{ display:inline-flex;align-items:center;gap:8px; height:32px;padding:0 16px;border-radius:var(--radius-pill); font-family:var(--font-onest);font-weight:600;font-size:14px;letter-spacing:1px; text-transform:uppercase; } .fin-page .tag.bg-gradient-purple-pink{background:var(--grad-purple-pink);color:var(--color-white);} .fin-page .tag.tag-outline{border:1.3px solid var(--color-blue);color:var(--color-blue);background:transparent;} .fin-page .tag.tag-outline-light{border:1.3px solid rgba(255,255,255,.4);color:var(--color-white);background:transparent;} /* fil-rouge : surtitre Tektur précédé du chevron picto-fleche */ .fin-page .fil-rouge{ display:inline-flex;align-items:center;gap:14px; font-family:var(--font-tektur);font-weight:700;font-size:20px;letter-spacing:1px; color:var(--color-blue);text-transform:uppercase;margin:0 0 18px; } .fin-page .fil-rouge::before{ content:"";width:26px;height:26px;flex:0 0 26px; background:url("../../images/financement/fil-rouge-chevron.png") center/contain no-repeat; } .fin-page .fil-rouge.on-dark{color:var(--color-white);} /* ---------- BOUTONS ---------- */ /* lien fléché */ .fin-page .link-arrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-tektur);font-weight:700;font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:var(--color-pink);} .fin-page .link-arrow::after{content:"→";transition:transform var(--dur) var(--revo-ease);} .fin-page .link-arrow:hover{color:var(--color-pink);} .fin-page .link-arrow:hover::after{transform:translateX(4px);} /* ---------- SOULIGNÉS DESSINÉS MAIN ---------- */ .fin-page .uline{position:relative;display:inline-block;white-space:nowrap;} .fin-page .uline__svg{position:absolute;left:-2%;right:-2%;bottom:-.26em;width:104%;height:.34em;overflow:visible;pointer-events:none;color:var(--color-green);} .fin-page .uline__svg path{fill:none;stroke:currentColor;stroke-width:11;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:100;stroke-dashoffset:100;} .fin-page .uline.is-drawn .uline__svg path{stroke-dashoffset:0;transition:stroke-dashoffset 760ms cubic-bezier(.7,0,.3,1);} .fin-page .uline--double .uline__svg{height:.5em;bottom:-.4em;} @media (prefers-reduced-motion:reduce){ .fin-page .uline__svg path{stroke-dashoffset:0!important;transition:none!important;} } /* ---------- TRIANGLES DÉCOR ---------- */ .fin-page .triangle{width:80px;height:80px;border-radius:14px;transform:rotate(45deg);} .fin-page .triangle-blue{background:var(--color-blue);} .fin-page .triangle-white{background:var(--color-white);} .fin-page .triangle-green{background:var(--color-green);} /* ============================================================ NAV ============================================================ */ @media (max-width:980px){ } /* ============================================================ FOOTER ============================================================ */ /* note légale repliable, discrète */ @media (max-width:780px){ } /* ========================================================================== Revolucy — Financement : sections.css hero · chiffres · constat · leviers · diagnostic · simulateur · méthode · pourquoi · faq · cta · mention ========================================================================== */ /* grain réutilisable (overlay subtil sur fonds pleins) */ .fin-page .grain::after{ content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;mix-blend-mode:overlay; background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxNjAnIGhlaWdodD0nMTYwJz48ZmlsdGVyIGlkPSduJz48ZmVUdXJidWxlbmNlIHR5cGU9J2ZyYWN0YWxOb2lzZScgYmFzZUZyZXF1ZW5jeT0nMC44NScgbnVtT2N0YXZlcz0nMicgc3RpdGNoVGlsZXM9J3N0aXRjaCcvPjwvZmlsdGVyPjxyZWN0IHdpZHRoPScxMDAlJyBoZWlnaHQ9JzEwMCUnIGZpbHRlcj0ndXJsKCNuKScgb3BhY2l0eT0nMC40NScvPjwvc3ZnPg=="); } /* reveal-on (AOS maison) — fade + translate up déclenché au scroll */ .fin-page [data-rvlaos]{opacity:0;transform:translateY(22px);transition:opacity .55s var(--revo-ease),transform .55s var(--revo-ease);transition-delay:var(--aos-delay,0ms);will-change:opacity,transform;} .fin-page [data-rvlaos="fade-left"]{transform:translateX(-26px);} .fin-page [data-rvlaos="fade-right"]{transform:translateX(26px);} .fin-page [data-rvlaos="zoom"]{transform:scale(.94);} .fin-page .aos-in[data-rvlaos]{opacity:1;transform:none;} @media (prefers-reduced-motion:reduce){ .fin-page [data-rvlaos]{opacity:1!important;transform:none!important;transition:none!important;} } .fin-page section{position:relative;} .fin-page .section-pad{padding:96px 0;} .fin-page .section-pad-sm{padding:72px 0;} /* ============================================================ HERO — #block-banner ============================================================ */ .fin-page #block-banner{ position:relative;overflow:hidden; background: radial-gradient(1200px 600px at 88% -8%, rgba(159,128,255,.14), transparent 60%), var(--color-light-grey); padding:64px 0 92px; } .fin-page #block-banner .hero-grid{ display:grid;grid-template-columns:7fr 5fr;gap:56px;align-items:center; } .fin-page .hero-copy{position:relative;z-index:2;} .fin-page .hero-copy .tag{margin-bottom:24px;} .fin-page #block-banner h1{ font-size:clamp(40px,4.6vw,62px);line-height:1.06;color:var(--color-blue); letter-spacing:.5px;margin:0 0 26px;font-weight:800; } .fin-page #block-banner h1 .hl{color:var(--color-blue);} .fin-page #block-banner h1 .accent{position:relative;display:inline-block;color:var(--color-blue);} .fin-page .hero-lead{font-size:19px;line-height:1.65;color:var(--color-black);max-width:38em;margin:0 0 30px;} .fin-page .hero-cta{display:flex;flex-wrap:wrap;gap:16px;align-items:center;margin-bottom:20px;} .fin-page .hero-reassurance{display:flex;align-items:center;gap:10px;font-size:15px;color:var(--color-dark-grey);} .fin-page .hero-reassurance::before{content:"";width:18px;height:18px;flex:0 0 18px;border-radius:50%;background:var(--color-green);box-shadow:0 0 0 4px rgba(185,255,102,.28);} /* visuel droit : bloc bleu heptagone "0 € aujourd'hui / lissé" */ .fin-page .hero-visual{position:relative;z-index:1;align-self:center;} .fin-page .hepta{ position:relative; background:var(--linear-gradient-violet-bleu); clip-path:polygon(26% 2%,74% 2%,98% 36%,88% 84%,50% 100%,12% 84%,2% 36%); padding:64px 52px 58px;color:var(--color-white);overflow:hidden; box-shadow:var(--revo-shadow-soft); aspect-ratio:1/1.02;display:flex;flex-direction:column;justify-content:center; } .fin-page .hepta .hepta-stamp{position:absolute;right:-30px;bottom:-30px;width:200px;opacity:.16;pointer-events:none;} .fin-page .hepta__label{font-family:var(--font-tektur);font-weight:700;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--color-green);margin-bottom:6px;} .fin-page .hepta__zero{font-family:var(--font-tektur);font-weight:900;font-size:clamp(64px,8vw,104px);line-height:.9;color:var(--color-white);letter-spacing:0;} .fin-page .hepta__zero span{color:var(--color-green);} .fin-page .hepta__sub{font-size:15px;line-height:1.4;color:rgba(255,255,255,.86);margin:14px 0 24px;max-width:22em;} .fin-page .hepta__compare{position:relative;z-index:1;} .fin-page .hepta__row{margin-bottom:14px;} .fin-page .hepta__row-top{display:flex;justify-content:space-between;align-items:baseline;font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:rgba(255,255,255,.8);margin-bottom:7px;font-family:var(--font-tektur);font-weight:600;} .fin-page .hepta__bar{height:18px;border-radius:6px;background:rgba(255,255,255,.16);overflow:hidden;display:flex;} .fin-page .hepta__bar--lump i{display:block;width:100%;background:var(--color-pink);border-radius:6px;} .fin-page .hepta__bar--spread{gap:4px;background:transparent;} .fin-page .hepta__bar--spread i{flex:1;background:var(--color-green);border-radius:3px;opacity:.92;} /* ============================================================ CHIFFRES CLÉS — bandeau navy pleine largeur ============================================================ */ .fin-page .bandeau-chiffres{background:var(--color-white);color:var(--color-black);overflow:hidden;} .fin-page .bandeau-chiffres .grain-wrap{position:relative;} .fin-page .chiffres-grid{ display:grid;grid-template-columns:repeat(4,1fr);gap:0; padding:62px 0;position:relative;z-index:1; } .fin-page .chiffre{padding:6px 34px;border-left:1px solid var(--color-grey-100);} .fin-page .chiffre:first-child{border-left:0;} .fin-page .chiffre__num{font-family:var(--font-tektur);font-weight:900;font-size:clamp(48px,5vw,72px);line-height:1;color:var(--color-blue);letter-spacing:0;} .fin-page .chiffre__num .u{color:var(--color-pink);} .fin-page .chiffre__lbl{font-size:15px;line-height:1.4;color:var(--color-dark-grey);margin-top:12px;} @media (max-width:860px){ .fin-page .chiffres-grid{grid-template-columns:repeat(2,1fr);gap:34px 0;} .fin-page .chiffre:nth-child(odd){border-left:0;} } /* ============================================================ CONSTAT ============================================================ */ .fin-page .constat-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center;} .fin-page .constat-text h2{font-size:clamp(30px,3.4vw,44px);margin-bottom:24px;line-height:1.12;} .fin-page .constat-text p{font-size:18px;line-height:1.7;color:var(--color-black);margin-bottom:18px;} .fin-page .constat-text .lede-strong{font-weight:600;color:var(--color-blue);} /* panneau "immobiliser vs lisser" */ .fin-page .constat-panel{background:var(--grad-panel);border-radius:var(--radius-xl);padding:42px 40px;color:var(--color-white);box-shadow:var(--revo-shadow-soft);position:relative;overflow:hidden;} .fin-page .constat-panel h3{color:var(--color-white);font-size:20px;letter-spacing:.04em;text-transform:uppercase;margin-bottom:26px;} .fin-page .constat-comp{margin-bottom:26px;} .fin-page .constat-comp:last-child{margin-bottom:0;} .fin-page .constat-comp__head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px;} .fin-page .constat-comp__head b{font-family:var(--font-onest);font-weight:600;font-size:16px;color:var(--color-white);} .fin-page .constat-comp__head span{font-size:13px;color:rgba(255,255,255,.7);} .fin-page .constat-comp__track{height:26px;border-radius:8px;background:rgba(255,255,255,.14);overflow:hidden;display:flex;} .fin-page .constat-comp--bloc .constat-comp__track i{width:100%;background:var(--color-pink);border-radius:8px;} .fin-page .constat-comp--lisse .constat-comp__track{background:transparent;gap:5px;} .fin-page .constat-comp--lisse .constat-comp__track i{flex:1;background:var(--color-green);border-radius:4px;} /* barres comparées : croissance scaleX au reveal (cf. fichier de référence) */ .fin-page .constat-comp--bloc .constat-comp__track i, .fin-page .constat-comp--lisse .constat-comp__track{transform:scaleX(0);transform-origin:left;} .fin-page .constat-comp--bloc .constat-comp__track i{transition:transform .6s var(--revo-ease) .12s;} .fin-page .constat-comp--lisse .constat-comp__track{transition:transform .6s var(--revo-ease) .30s;} .fin-page .constat-panel.aos-in .constat-comp--bloc .constat-comp__track i, .fin-page .constat-panel.aos-in .constat-comp--lisse .constat-comp__track{transform:scaleX(1);} @media (prefers-reduced-motion:reduce){ .fin-page .constat-comp--bloc .constat-comp__track i, .fin-page .constat-comp--lisse .constat-comp__track{transform:none;transition:none;} } /* ============================================================ LEVIERS — 6 cartes polygonales ============================================================ */ .fin-page .leviers-head{text-align:center;margin:0 auto 56px;} .fin-page .leviers-head .fil-rouge{display:inline-flex;} .fin-page .leviers-head h2{font-size:clamp(32px,3.8vw,50px);margin-bottom:22px;line-height:1.08;} .fin-page .leviers-head p{font-size:18px;line-height:1.65;color:var(--color-black);} .fin-page .leviers-grid{ display:grid;grid-template-columns:repeat(3,1fr);gap:22px; } .fin-page .levier{position:relative;display:flex;} .fin-page .levier-card{ position:relative;width:100%;display:flex;flex-direction:column;background:var(--color-white); border:1.5px solid var(--color-grey-100);border-radius:16px; padding:28px 26px 26px;box-shadow:var(--revo-shadow-soft); transition:transform .28s var(--revo-ease),box-shadow .28s var(--revo-ease),border-color .28s var(--revo-ease); } .fin-page .levier:hover .levier-card{transform:translateY(-4px);box-shadow:var(--revo-shadow-soft);border-color:var(--color-blue);} .fin-page .levier-top{display:flex;align-items:center;gap:12px;margin-bottom:16px;} .fin-page .levier-idx{flex:0 0 38px;width:38px;height:38px;border-radius:10px;background:var(--color-grey-100);display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-tektur);font-weight:800;font-size:16px;color:var(--color-blue);transition:background .28s var(--revo-ease),color .28s var(--revo-ease);} .fin-page .levier:hover .levier-idx{background:var(--color-green);} .fin-page .levier-partner{font-family:var(--font-tektur);font-weight:700;font-size:12.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--color-dark-grey);} .fin-page .levier-title{font-family:var(--font-tektur);font-weight:700;font-size:24px;line-height:1.16;color:var(--color-blue);letter-spacing:.3px;margin:0 0 12px;} .fin-page .levier-title .salted{font-family:var(--font-salted);text-transform:uppercase;font-weight:400;color:var(--color-blue);letter-spacing:0;font-size:1.08em;} .fin-page .levier-desc{font-family:var(--font-onest);font-size:15px;line-height:1.55;color:var(--color-black);margin:0 0 20px;} .fin-page .levier-desc b{color:var(--color-blue);font-weight:700;} .fin-page .levier-figs{list-style:none;margin:auto 0 0;padding:18px 0 0;border-top:1px solid var(--color-grey-100);display:flex;flex-direction:column;gap:9px;} .fin-page .levier-figs li{position:relative;padding-left:25px;font-family:var(--font-onest);font-size:14.5px;line-height:1.4;color:var(--color-black);} .fin-page .levier-figs li::before{content:"";position:absolute;left:0;top:2px;width:16px;height:16px;border-radius:5px;background-color:var(--color-green); -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center/10px no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center/10px no-repeat;} .fin-page .levier-figs li b{color:var(--color-blue);font-weight:700;} /* carte signature (iii-Financements) : fond dégradé */ .fin-page .levier--feature .levier-card{background:linear-gradient(135deg,var(--color-blue) 0%,var(--color-purple) 52%,var(--color-pink) 100%);border:none;box-shadow:0 22px 50px -18px rgba(8,24,175,.5);} .fin-page .levier--feature .levier-idx{background:rgba(255,255,255,.18);color:var(--color-white);} .fin-page .levier--feature:hover .levier-idx{background:var(--color-green);color:var(--color-blue);} .fin-page .levier--feature .levier-partner{color:rgba(255,255,255,.8);} .fin-page .levier--feature .levier-title{color:var(--color-white);} .fin-page .levier--feature .levier-desc{color:rgba(255,255,255,.92);} .fin-page .levier--feature .levier-desc b{color:var(--color-green);} .fin-page .levier--feature .levier-figs{border-top-color:rgba(255,255,255,.22);} .fin-page .levier--feature .levier-figs li{color:rgba(255,255,255,.92);} .fin-page .levier--feature .levier-figs li b{color:var(--color-green);} .fin-page .levier--feature .levier-figs li::before{background-color:var(--color-green);} .fin-page .leviers-mention{margin-top:44px;text-align:center;font-size:16px;color:var(--color-dark-grey);max-width:820px;margin-left:auto;margin-right:auto;} .fin-page .leviers-mention strong{color:var(--color-blue);font-weight:600;} @media (max-width:900px){ .fin-page .leviers-grid{grid-template-columns:1fr;max-width:460px;margin:0 auto;} } @media (min-width:901px) and (max-width:1100px){ .fin-page .leviers-grid{grid-template-columns:repeat(2,1fr);} } /* ============================================================ MINI-DIAGNOSTIC — pure CSS radio reveal ============================================================ */ .fin-page .diag{background:var(--color-light-grey);} .fin-page .diag-wrap{display:grid;grid-template-columns:1fr 1.1fr;gap:56px;align-items:start;} .fin-page .diag-intro h2{font-size:clamp(30px,3.4vw,44px);line-height:1.1;margin-bottom:20px;} .fin-page .diag-intro p{font-size:18px;line-height:1.65;color:var(--color-black);margin-bottom:28px;} .fin-page .diag-q{font-family:var(--font-tektur);font-weight:700;font-size:18px;letter-spacing:.04em;text-transform:uppercase;color:var(--color-blue);margin-bottom:18px;} .fin-page .diag-options{display:flex;flex-direction:column;gap:12px;} .fin-page .diag-options input{position:absolute;opacity:0;width:0;height:0;} .fin-page .diag-opt{ display:flex;align-items:center;gap:14px;padding:16px 20px;border-radius:var(--radius-md); border:1.5px solid var(--color-grey-100);background:var(--color-white);cursor:pointer; font-family:var(--font-onest);font-weight:500;font-size:16px;color:var(--color-black); transition:border-color var(--dur) var(--revo-ease),box-shadow var(--dur) var(--revo-ease),transform var(--dur) var(--revo-ease); } .fin-page .diag-opt .dot{width:20px;height:20px;flex:0 0 20px;border-radius:50%;border:2px solid var(--color-grey-200);transition:all var(--dur) var(--revo-ease);} .fin-page .diag-opt:hover{border-color:var(--color-purple);transform:translateX(3px);} .fin-page .diag-options input:checked + .diag-opt{border-color:var(--color-pink);box-shadow:var(--revo-shadow-soft);} .fin-page .diag-options input:checked + .diag-opt .dot{border-color:var(--color-pink);background:radial-gradient(circle at center,var(--color-pink) 0 6px,transparent 7px);} .fin-page .diag-options input:focus-visible + .diag-opt{outline:2px solid var(--color-pink);outline-offset:2px;} .fin-page .diag-result{position:relative;min-height:360px;} .fin-page .diag-panel{ position:absolute;inset:0;opacity:0;transform:translateY(14px);pointer-events:none; transition:opacity .45s var(--revo-ease),transform .45s var(--revo-ease); background:var(--grad-panel);color:var(--color-white);border-radius:var(--radius-xl);padding:40px 38px;box-shadow:var(--revo-shadow-soft);overflow:hidden; display:flex;flex-direction:column; } .fin-page .diag-panel .grain{position:absolute;inset:0;} .fin-page .diag-reco-tag{align-self:flex-start;} .fin-page .diag-panel h3{color:var(--color-white);font-size:24px;line-height:1.15;margin:20px 0 14px;position:relative;z-index:1;} .fin-page .diag-panel h3 em{font-style:normal;color:var(--color-green);} .fin-page .diag-panel p{font-size:16px;line-height:1.6;color:rgba(255,255,255,.9);position:relative;z-index:1;margin:0 0 22px;} .fin-page .diag-panel .diag-levers{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;position:relative;z-index:1;} .fin-page .diag-panel .diag-levers span{font-family:var(--font-tektur);font-weight:600;font-size:12px;letter-spacing:.04em;text-transform:uppercase;padding:7px 13px;border-radius:var(--radius-pill);background:rgba(255,255,255,.14);color:var(--color-white);} .fin-page .diag-cta{margin-top:26px;} /* révélation par radio (pur CSS, via :has sur l'ancêtre stable) */ .fin-page .diag:has(#diag-1:checked) #dp-1, .fin-page .diag:has(#diag-2:checked) #dp-2, .fin-page .diag:has(#diag-3:checked) #dp-3, .fin-page .diag:has(#diag-4:checked) #dp-4{opacity:1;transform:none;pointer-events:auto;} @media (max-width:860px){ .fin-page .diag-wrap{grid-template-columns:1fr;gap:34px;} .fin-page .diag-result{min-height:0;} .fin-page .diag-panel{position:relative;display:none;} .fin-page .diag:has(#diag-1:checked) #dp-1, .fin-page .diag:has(#diag-2:checked) #dp-2, .fin-page .diag:has(#diag-3:checked) #dp-3, .fin-page .diag:has(#diag-4:checked) #dp-4{display:flex;} } /* ============================================================ SIMULATEUR OLINN ============================================================ */ .fin-page .simu{background:var(--color-white);} .fin-page .simu-head{margin:0 auto 50px;text-align:center;} .fin-page .simu-head h2{font-size:clamp(30px,3.6vw,46px);line-height:1.1;margin-bottom:20px;} .fin-page .simu-head p{font-size:18px;line-height:1.65;color:var(--color-black);} .fin-page .simu-card{ background:var(--color-light-grey);border-radius:var(--radius-xl);padding:48px;box-shadow:var(--revo-shadow-soft); border:1px solid var(--color-grey-100); display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center; } .fin-page .simu-controls .simu-label{font-family:var(--font-tektur);font-weight:700;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--color-blue);margin-bottom:14px;display:flex;justify-content:space-between;align-items:baseline;} .fin-page .simu-controls .simu-label b{font-family:var(--font-tektur);font-weight:900;font-size:26px;color:var(--color-pink);letter-spacing:0;} /* range */ .fin-page .simu-range{-webkit-appearance:none;appearance:none;width:100%;height:8px;border-radius:var(--radius-pill);background:var(--color-grey-100);outline:none;margin:6px 0 8px;} .fin-page .simu-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:30px;height:30px;border-radius:50%;background:var(--color-pink);border:4px solid var(--color-white);box-shadow:0 4px 12px rgba(251,0,101,.4);cursor:pointer;transition:transform var(--dur) var(--revo-ease);} .fin-page .simu-range::-webkit-slider-thumb:hover{transform:scale(1.12);} .fin-page .simu-range::-moz-range-thumb{width:26px;height:26px;border-radius:50%;background:var(--color-pink);border:4px solid var(--color-white);box-shadow:0 4px 12px rgba(251,0,101,.4);cursor:pointer;} .fin-page .simu-ticks{display:flex;justify-content:space-between;font-size:12px;color:var(--color-dark-grey);font-family:var(--font-tektur);font-weight:600;margin-bottom:32px;} .fin-page .simu-ticks span{cursor:pointer;} .fin-page .simu-ticks span.on{color:var(--color-pink);} .fin-page .simu-duree-label{font-family:var(--font-tektur);font-weight:700;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--color-blue);margin-bottom:12px;} .fin-page .simu-seg{display:inline-flex;background:var(--color-white);border:1.5px solid var(--color-grey-100);border-radius:var(--radius-md);padding:5px;gap:4px;} .fin-page .simu-seg label{padding:11px 22px;border-radius:7px;font-family:var(--font-tektur);font-weight:700;font-size:16px;letter-spacing:.03em;color:var(--color-blue);cursor:pointer;transition:all var(--dur) var(--revo-ease);} .fin-page .simu-seg input{position:absolute;opacity:0;width:0;height:0;} /* pill validé : l'actif = aplat plein (choix structurant = bleu), pas un dégradé. */ .fin-page .simu-seg input:checked + label{background:var(--color-blue);color:var(--color-white);box-shadow:var(--revo-shadow-soft);} /* résultat */ .fin-page .simu-result{text-align:center;} .fin-page .simu-result .simu-result-lbl{font-family:var(--font-tektur);font-weight:700;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--color-dark-grey);margin-bottom:6px;} .fin-page .simu-amount{font-family:var(--font-tektur);font-weight:900;color:var(--color-blue);line-height:1;letter-spacing:0;display:flex;align-items:baseline;justify-content:center;gap:8px;} .fin-page .simu-amount .val{font-size:clamp(54px,7vw,88px);font-variant-numeric:tabular-nums;} .fin-page .simu-amount .cur{font-size:32px;color:var(--color-pink);} .fin-page .simu-amount-sub{font-size:14px;color:var(--color-dark-grey);margin-top:8px;} /* viz lump vs spread */ .fin-page .simu-viz{margin-top:30px;text-align:left;background:var(--color-white);border-radius:var(--radius-md);padding:22px;border:1px solid var(--color-grey-100);} .fin-page .simu-viz .vrow{margin-bottom:18px;} .fin-page .simu-viz .vrow:last-child{margin-bottom:0;} .fin-page .simu-viz .vtop{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;margin-bottom:8px;} .fin-page .simu-viz .vtop b{font-family:var(--font-tektur);font-weight:700;color:var(--color-blue);font-size:13px;letter-spacing:.03em;text-transform:uppercase;} .fin-page .simu-viz .vtop span{color:var(--color-dark-grey);font-size:13px;} .fin-page .simu-viz .vbar{height:24px;border-radius:7px;display:flex;overflow:hidden;background:var(--color-grey-100);} .fin-page .simu-viz .vbar--lump i{width:100%;background:linear-gradient(90deg,var(--color-pink),var(--color-pink));border-radius:7px;transform-origin:left;transform:scaleX(0);transition:transform .55s var(--revo-ease);} .fin-page .simu-viz .vbar--spread{background:transparent;gap:3px;transform-origin:left;transform:scaleX(0);transition:transform .55s var(--revo-ease) .08s;} .fin-page .simu-viz .vbar--spread i{flex:1;background:var(--color-green);border-radius:3px;} .fin-page .aos-in .simu-viz .vbar--lump i, .fin-page .aos-in .simu-viz .vbar--spread{transform:scaleX(1);} @media (prefers-reduced-motion:reduce){ .fin-page .simu-viz .vbar--lump i, .fin-page .simu-viz .vbar--spread{transition:none;} } /* table */ .fin-page .simu-table-wrap{margin-top:46px;overflow-x:auto;} .fin-page table.simu-table{width:100%;border-collapse:collapse;font-size:16px;min-width:640px;} .fin-page .simu-table caption{text-align:left;font-size:14px;color:var(--color-dark-grey);margin-bottom:14px;} .fin-page .simu-table th, .fin-page .simu-table td{padding:16px 18px;text-align:right;border-bottom:1px solid var(--color-grey-100);font-variant-numeric:tabular-nums;} .fin-page .simu-table thead th{font-family:var(--font-tektur);font-weight:700;font-size:14px;letter-spacing:.04em;text-transform:uppercase;color:var(--color-blue);text-align:right;border-bottom:2px solid var(--color-blue);} .fin-page .simu-table th:first-child, .fin-page .simu-table td:first-child{text-align:left;font-family:var(--font-tektur);font-weight:700;color:var(--color-blue);} .fin-page .simu-table tbody tr{transition:background var(--dur) var(--revo-ease);} .fin-page .simu-table tbody tr:hover, .fin-page .simu-table tbody tr.active{background:rgba(159,128,255,.1);} .fin-page .simu-table td.cell-active{color:var(--color-pink);font-weight:700;} .fin-page .simu-note{margin-top:18px;font-size:15px;color:var(--color-dark-grey);} /* bénéfices 4 angles */ .fin-page .simu-benefits{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:60px;} .fin-page .benefit{background:var(--color-white);border:1px solid var(--color-grey-100);border-radius:var(--radius-md);padding:28px 26px;box-shadow:var(--revo-shadow-soft);transition:transform var(--dur) var(--revo-ease),box-shadow var(--dur) var(--revo-ease);} .fin-page .benefit:hover{transform:translateY(-4px);box-shadow:var(--revo-shadow-soft);} .fin-page .benefit .b-ico{width:46px;height:46px;border-radius:11px;background:var(--grad-purple-pink);display:flex;align-items:center;justify-content:center;margin-bottom:18px;} .fin-page .benefit .b-ico svg{width:24px;height:24px;stroke:var(--color-white);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;} .fin-page .benefit h3{font-size:18px;color:var(--color-blue);margin-bottom:8px;letter-spacing:.3px;} .fin-page .benefit p{font-size:14.5px;line-height:1.5;color:var(--color-black);margin:0;} @media (max-width:900px){ .fin-page .simu-card{grid-template-columns:1fr;gap:38px;padding:32px;} .fin-page .simu-benefits{grid-template-columns:1fr 1fr;} } @media (max-width:560px){ .fin-page .simu-benefits{grid-template-columns:1fr;} } /* ============================================================ MÉTHODE — 4 étapes reliées par un trait qui se trace ============================================================ */ .fin-page .methode{background:var(--color-blue);color:var(--color-white);overflow:hidden;} .fin-page .methode .grain-wrap{position:relative;z-index:1;} .fin-page .methode-head{text-align:center;max-width:720px;margin:0 auto 64px;} .fin-page .methode-head .fil-rouge{display:inline-flex;} .fin-page .methode-head h2{color:var(--color-white);font-size:clamp(32px,3.8vw,50px);line-height:1.08;} .fin-page .methode-head h2 .salted{font-family:var(--font-salted);color:var(--color-green);font-size:.9em;} .fin-page .methode-timeline{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:28px;} .fin-page .methode-line{position:absolute;top:34px;left:8%;right:8%;height:3px;background:rgba(255,255,255,.18);border-radius:2px;} .fin-page .methode-line__fill{position:absolute;inset:0;width:0;background:var(--color-green);border-radius:2px;transition:width 1.1s var(--revo-ease);} .fin-page .methode-step{position:relative;text-align:center;padding-top:0;} .fin-page .methode-num{width:68px;height:68px;margin:0 auto 24px;border-radius:18px;background:var(--color-blue);border:3px solid rgba(255,255,255,.25);display:flex;align-items:center;justify-content:center;font-family:var(--font-tektur);font-weight:900;font-size:28px;color:var(--color-white);position:relative;z-index:2;transition:border-color .5s var(--revo-ease),background .5s var(--revo-ease),color .5s var(--revo-ease);} .fin-page .methode-step.lit .methode-num{border-color:var(--color-green);background:var(--color-green);color:var(--color-blue);} .fin-page .methode-step h3{color:var(--color-white);font-size:21px;margin-bottom:12px;letter-spacing:.4px;} .fin-page .methode-step p{font-size:15.5px;line-height:1.6;color:rgba(255,255,255,.82);margin:0;} @media (max-width:860px){ .fin-page .methode-timeline{grid-template-columns:1fr;gap:34px;max-width:440px;margin:0 auto;} .fin-page .methode-line{left:34px;right:auto;top:0;bottom:0;width:3px;height:auto;} .fin-page .methode-line__fill{width:100%!important;height:0;transition:height 1.1s var(--revo-ease);} .fin-page .methode-step{display:grid;grid-template-columns:68px 1fr;gap:20px;text-align:left;align-items:start;} .fin-page .methode-num{margin:0;} } /* ============================================================ POURQUOI REVOLUCY ============================================================ */ .fin-page .pourquoi-head{text-align:center;max-width:760px;margin:0 auto 56px;} .fin-page .pourquoi-head .fil-rouge{display:inline-flex;} .fin-page .pourquoi-head h2{font-size:clamp(30px,3.6vw,46px);line-height:1.1;} .fin-page .pourquoi-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;} .fin-page .pourquoi-item{display:grid;grid-template-columns:54px 1fr;gap:22px;background:var(--color-light-grey);border:1px solid var(--color-grey-100);border-radius:var(--radius-md);padding:30px 32px;transition:transform var(--dur) var(--revo-ease),box-shadow var(--dur) var(--revo-ease);} .fin-page .pourquoi-item:hover{transform:translateY(-4px);box-shadow:var(--revo-shadow-soft);} .fin-page .pourquoi-check{width:54px;height:54px;border-radius:14px;background:var(--color-green);display:flex;align-items:center;justify-content:center;} .fin-page .pourquoi-check svg{width:28px;height:28px;stroke:var(--color-blue);fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;} .fin-page .pourquoi-item h3{font-size:20px;color:var(--color-blue);margin-bottom:10px;letter-spacing:.3px;} .fin-page .pourquoi-item p{font-size:15.5px;line-height:1.6;color:var(--color-black);margin:0;} @media (max-width:860px){ .fin-page .pourquoi-grid{grid-template-columns:1fr;} } /* ============================================================ FAQ ============================================================ */ .fin-page .faq-head{text-align:center;margin-bottom:48px;} .fin-page .faq-head h2{font-size:clamp(30px,3.6vw,46px);line-height:1.1;} /* JS height transition: default closed */ @media (prefers-reduced-motion:reduce){ } /* ============================================================ CTA FINAL ============================================================ */ .fin-page .cta-final{background:var(--linear-gradient-violet-bleu);color:var(--color-white);overflow:hidden;text-align:center;} .fin-page .cta-final .grain-wrap{position:relative;z-index:1;} .fin-page .cta-final .cta-stamp{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:520px;max-width:80%;opacity:.08;pointer-events:none;z-index:0;} .fin-page .cta-final h2{color:var(--color-white);font-size:clamp(34px,4.4vw,58px);line-height:1.06;margin:0 auto 22px;max-width:16ch;} .fin-page .cta-final h2 .salted{font-family:var(--font-salted);color:var(--color-green);} .fin-page .cta-final p{font-size:19px;line-height:1.6;color:rgba(255,255,255,.9);max-width:54ch;margin:0 auto 38px;} .fin-page .cta-final .hero-cta{justify-content:center;} /* ============================================================ RESPONSIVE GÉNÉRAL ============================================================ */ @media (max-width:900px){ .fin-page #block-banner .hero-grid{grid-template-columns:1fr;gap:44px;} .fin-page .hero-visual{max-width:440px;margin:0 auto;width:100%;} .fin-page .constat-grid{grid-template-columns:1fr;gap:38px;} .fin-page .section-pad{padding:68px 0;} } /* ========================================================================== Revolucy — Financement : shell.css (registre PAGE PILIER, sobre) Nav de site standard · hero clair · mini-diagnostic intégré au hero. Accent dédié financements : VERT (var(--color-green)). ========================================================================== */ /* ---------- NAV de site (standard, sobre) ---------- */ .fin-page .fin-nav{position:sticky;top:0;z-index:60;background:var(--color-white);box-shadow:0 2px 18px -8px rgba(8,24,175,.18);} .fin-page .fin-nav__inner{display:flex;align-items:center;gap:28px;padding:15px 0;} .fin-page .fin-nav__logo img{height:38px;display:block;width:auto;} .fin-page .fin-nav__links{display:flex;gap:24px;margin-left:auto;align-items:center;font-family:var(--font-tektur);font-weight:600;font-size:13px;letter-spacing:.04em;text-transform:uppercase;} .fin-page .fin-nav__links a{color:var(--color-blue);position:relative;} .fin-page .fin-nav__links a::after{content:"";position:absolute;left:0;right:0;bottom:-5px;height:2px;background:var(--color-pink);transform:scaleX(0);transform-origin:left;transition:transform .25s var(--revo-ease);} .fin-page .fin-nav__links a:hover::after, .fin-page .fin-nav__links a.on::after{transform:scaleX(1);} .fin-page .fin-nav__links a:hover, .fin-page .fin-nav__links a.on{color:var(--color-pink);} .fin-page .fin-nav__cta{display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border-radius:8px;border:1.4px solid var(--color-blue);color:var(--color-blue);font-family:var(--font-tektur);font-weight:700;font-size:13px;letter-spacing:.04em;text-transform:uppercase;transition:.2s var(--revo-ease);} .fin-page .fin-nav__cta:hover{background:var(--color-blue);color:var(--color-white);transform:translateY(-1px);} .fin-page .fin-nav__cta svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;} @media (max-width:1040px){ .fin-page .fin-nav__links{display:none;} .fin-page .fin-nav__inner{gap:14px;} } /* ---------- HERO plein cadre (patron DS validé : dégradé bleu→violet + grain) ---------- */ .fin-page .fin-hero{position:relative;overflow:hidden;background:var(--linear-gradient-violet-bleu);color:var(--color-white);padding:clamp(48px,5vw,86px) 0 clamp(58px,6.4vw,100px);} /* décor de marque : polygone clair diffus en haut à droite */ .fin-page .fin-hero__decor{position:absolute;top:-140px;right:-90px;width:min(48vw,580px);aspect-ratio:1/1.02;background:radial-gradient(circle at 50% 40%,rgba(159,128,255,.55),transparent 70%);opacity:.5;clip-path:polygon(26% 2%,74% 2%,98% 36%,88% 84%,50% 100%,12% 84%,2% 36%);pointer-events:none;z-index:0;} .fin-page .fin-hero__inner{position:relative;z-index:2;} .fin-page .fin-hero__grid{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);gap:clamp(32px,4vw,64px);align-items:center;} /* fil d'ariane (patron DS : Tektur vert, chevron) */ .fin-page .fin-hero__title{font-family:var(--font-tektur);font-weight:800;font-size:clamp(34px,4.4vw,60px);line-height:1.08;letter-spacing:.5px;color:var(--color-white);margin:0 0 22px;text-wrap:balance;} .fin-page .fin-hero__title em{font-style:normal;position:relative;white-space:nowrap;color:var(--color-white);} .fin-page .fin-hero__underline{position:absolute;left:-1.5%;bottom:-.16em;width:103%;height:.36em;overflow:visible;pointer-events:none;} .fin-page .fin-hero__underline path{fill:none;stroke:var(--color-green);stroke-width:7;stroke-linecap:round;stroke-linejoin:round;} .fin-page .fin-hero__lead{font-family:var(--font-onest);font-size:clamp(16px,1.2vw,18px);line-height:1.65;color:rgba(255,255,255,.88);max-width:38em;margin:0 0 28px;} .fin-page .fin-hero__cta{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:22px;} .fin-page .fin-hero__reassure{display:flex;flex-wrap:wrap;gap:9px 22px;padding-top:20px;border-top:1px solid rgba(255,255,255,.2);} .fin-page .fin-hero__reassure span{display:inline-flex;align-items:center;gap:9px;font-family:var(--font-onest);font-size:15px;color:rgba(255,255,255,.78);} .fin-page .fin-hero__reassure span::before{content:"";flex:0 0 8px;width:8px;height:8px;border-radius:2px;background:var(--color-green);transform:rotate(45deg);} .fin-page .fin-hero__reassure strong{color:var(--color-white);font-weight:700;} /* entrée échelonnée (sobre, courte) */ @media (prefers-reduced-motion:no-preference){ html.js .fin-page .fin-hero__intro > [data-hero], html.js .fin-page .fin-diag[data-hero]{opacity:0;transform:translateY(18px);animation:fin-heroUp .5s var(--revo-ease) both;} html.js .fin-page .fin-hero__intro > [data-hero]:nth-child(1){animation-delay:.05s;} html.js .fin-page .fin-hero__intro > [data-hero]:nth-child(2){animation-delay:.14s;} html.js .fin-page .fin-hero__intro > [data-hero]:nth-child(3){animation-delay:.24s;} html.js .fin-page .fin-hero__intro > [data-hero]:nth-child(4){animation-delay:.34s;} html.js .fin-page .fin-hero__intro > [data-hero]:nth-child(5){animation-delay:.44s;} html.js .fin-page .fin-diag[data-hero]{animation-delay:.30s;} html.js .fin-page .fin-hero__underline path{stroke-dasharray:1;stroke-dashoffset:1;animation:fin-draw .6s var(--revo-ease) .85s forwards;} } @keyframes fin-heroUp{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:none;}} @keyframes fin-draw{to{stroke-dashoffset:0;}} .fin-page .fin-hero__underline path{stroke-dasharray:none;stroke-dashoffset:0;} /* ---------- MINI-DIAGNOSTIC (carte hero, sobre) ---------- */ .fin-page .fin-diag{background:var(--color-white);color:var(--color-black);border-radius:var(--radius-lg);box-shadow:var(--revo-shadow-soft);border:1px solid var(--color-grey-100);padding:clamp(24px,2.4vw,32px);} .fin-page .fin-diag__label{display:inline-flex;align-items:center;gap:10px;margin-bottom:14px;font-family:var(--font-tektur);font-weight:700;font-size:13px;letter-spacing:.05em;text-transform:uppercase;color:var(--color-blue);} .fin-page .fin-diag__label-num{width:24px;height:24px;border-radius:7px;background:var(--color-green);color:var(--color-blue);display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:900;} .fin-page .fin-diag__q{font-family:var(--font-tektur);font-weight:700;font-size:clamp(21px,2vw,26px);color:var(--color-blue);margin:0 0 6px;line-height:1.18;} .fin-page .fin-diag__hint{font-family:var(--font-onest);font-size:15px;line-height:1.5;color:var(--color-dark-grey);margin:0 0 18px;} .fin-page .fin-diag__result{display:none;margin-top:16px;padding:18px;border-radius:var(--radius-md);background:rgba(8,24,175,.04);border:1.5px solid var(--color-grey-100);border-left:4px solid var(--color-green);} .fin-page .fin-diag__result.is-open{display:block;animation:fin-heroUp .35s var(--revo-ease);} .fin-page .fin-diag__result-lead{font-family:var(--font-onest);font-size:15.5px;line-height:1.5;color:var(--color-black);margin:0 0 12px;} .fin-page .fin-diag__result-lead strong{color:var(--color-blue);font-weight:700;} .fin-page .fin-diag__chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;} .fin-page .fin-diag__chip{font-family:var(--font-tektur);font-weight:700;font-size:12.5px;letter-spacing:.01em;padding:8px 13px;border-radius:8px;background:var(--color-blue);color:var(--color-white);} .fin-page .fin-diag__cta{width:100%;} @media (prefers-reduced-motion:reduce){ .fin-page .fin-diag__result.is-open{animation:none;} } @media (max-width:900px){ .fin-page .fin-hero__grid{grid-template-columns:1fr;gap:38px;} .fin-page .fin-diag{max-width:560px;} } /* Base typo de la page (remplace le reset body/html/* retire au scoping). */ .fin-page{font-family:var(--font-onest);font-size:18px;line-height:1.6;color:var(--color-black);} .fin-page *{box-sizing:border-box;} /* Chevauchement du hero sous le menu transparent du site (cf. .hero-secondaire). */ .fin-page .fin-hero{margin-top:-10vw;padding-top:calc(clamp(16px,2vw,32px) + 10vw);} @media (max-width:1199px){.fin-page .fin-hero{margin-top:0;padding-top:clamp(16px,2vw,32px);}} /* Hero : statement en Onest, mot d'accent en Tektur (regle DS 23/07). */ .fin-page .fin-hero__title{font-family:var(--font-onest);font-weight:600;letter-spacing:-.035em;} .fin-page .fin-hero__title-lead{display:block;font-size:clamp(36px,4.15vw,60px);font-weight:600;line-height:1.02;letter-spacing:-.035em;} .fin-page .fin-hero__title-tail{display:block;margin-top:12px;font-size:clamp(24px,2.55vw,36px);font-weight:500;line-height:1.16;letter-spacing:-.02em;} .fin-page .fin-hero__accent{font-family:var(--font-tektur);font-weight:700;text-transform:uppercase;letter-spacing:.02em;} /* Section FAQ : fond, l'accordeon vient de faq.css du site. */ .fin-page .fin-faq{background:var(--color-light-grey);} .fin-page .faq__titre{font-family:var(--font-onest);font-weight:600;letter-spacing:normal;line-height:1.35;color:inherit;} .fin-page .cta-final{background-color:var(--color-light-grey);} /* Fil d'Ariane du hero : blanc, lisible sur le fond bleu. */ .fin-page .fin-hero__crumb{margin:0 0 12px;} .fin-page .fin-hero__crumb,.fin-page .fin-hero__crumb a,.fin-page .fin-hero__crumb .fil__actuel{color:var(--color-white);} /* Boutons a degrade rose : texte blanc (le bouton vert garde son texte bleu, DS). */ .fin-page a.btn-custom-linear-pink,.fin-page a.btn-custom-linear-pink:hover,.fin-page button.btn-custom-linear-pink{color:var(--color-white);} /* Bouton