@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&family=Source+Serif+4:opsz,wght@8..60,600;8..60,700&display=swap');

/* Nuancier Luperca initial, conserve pour rester coherent avec le POC valide. */
:root { --ink:#17231f; --paper:#f7f8f5; --line:#d5ddd5; --muted:#63706a; --mint:#c7ead6; --mint-strong:#1e7255; --coral:#ef6f55; --sand:#edf0e9; --white:#fff; --max:1180px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Manrope,Arial,sans-serif; font-size:16px; line-height:1.5; }
a { color:inherit; text-decoration:none; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:absolute; left:12px; top:-50px; background:var(--ink); color:white; padding:9px 12px; z-index:20; } .skip-link:focus { top:12px; }
.site-header { min-height:74px; max-width:1320px; margin:auto; padding:0 28px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); background:var(--paper); position:sticky; top:0; z-index:10; }
.brand { display:inline-flex; align-items:center; gap:10px; font-size:20px; font-weight:800; letter-spacing:0; }.brand-mark { display:grid; grid-template-columns:repeat(3,6px); gap:3px; width:24px; height:24px; align-items:center; }.brand-mark i { display:block; height:6px; border-radius:50%; background:var(--mint-strong); }.brand-mark i:nth-child(2) { background:var(--coral); transform:translateY(-5px); }.brand-mark i:nth-child(3) { background:var(--ink); transform:translateY(4px); }
.site-nav { display:flex; align-items:center; gap:28px; color:var(--muted); font-size:14px; font-weight:700; }.site-nav a:hover,.text-link:hover { color:var(--mint-strong); }.header-actions { display:flex; gap:18px; align-items:center; }.text-link { font-size:14px; font-weight:700; }.button { min-height:44px; display:inline-flex; justify-content:center; align-items:center; gap:11px; padding:10px 17px; border:1px solid transparent; border-radius:6px; font-size:14px; font-weight:800; transition:transform .18s ease, background .18s ease; }.button:hover { transform:translateY(-2px); }.button--dark { min-height:38px; padding:8px 13px; background:var(--ink); color:#fff; }.button--coral { background:var(--coral); color:#fff; }.button--ghost { border-color:var(--ink); }.menu-toggle { display:none; }
.hero { max-width:1320px; min-height:790px; margin:auto; padding:105px 52px 42px; overflow:hidden; position:relative; border-bottom:1px solid var(--line); }.hero-copy { max-width:735px; position:relative; z-index:2; }.eyebrow,.section-kicker { font-family:"DM Mono",monospace; font-size:12px; font-weight:500; letter-spacing:0; text-transform:uppercase; color:var(--mint-strong); }.eyebrow { display:flex; gap:8px; align-items:center; }.eyebrow span { width:8px; height:8px; border-radius:50%; background:var(--coral); }.hero h1 { font-family:"Source Serif 4",Georgia,serif; font-size:clamp(56px,8vw,112px); line-height:.92; letter-spacing:0; margin:20px 0 26px; font-weight:700; }.hero-lead { max-width:565px; font-size:19px; color:var(--muted); }.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }.hero-product { margin:68px auto 0; position:relative; width:min(1050px,100%); border:1px solid var(--line); background:#fff; box-shadow:14px 14px 0 var(--mint); }.hero-product img { width:100%; display:block; object-fit:cover; object-position:top center; aspect-ratio:1.95 / 1; }.product-label { position:absolute; left:16px; top:14px; z-index:2; background:var(--ink); color:white; padding:7px 10px; font-size:11px; font-family:"DM Mono",monospace; }.live-dot { display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--mint); margin-right:5px; }
.proof-strip { min-height:74px; display:flex; align-items:center; justify-content:center; gap:25px; background:var(--ink); color:#fff; padding:16px 28px; }.proof-strip p { font-family:"Source Serif 4",Georgia,serif; font-size:19px; margin:0; }.proof-strip span { color:var(--mint); }
.intro-band,.feature-showcase,.visual-band,.method-band,.audience-band,.faq-band,.final-cta { max-width:1320px; margin:auto; padding-left:52px; padding-right:52px; }.intro-band { padding-top:125px; padding-bottom:125px; }.intro-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:80px; align-items:end; }.intro-grid h2,.section-heading h2,.method-title h2,.audience-copy h2,.faq-intro h2,.final-cta h2 { font-family:"Source Serif 4",Georgia,serif; line-height:1.02; letter-spacing:0; font-size:clamp(38px,5vw,68px); margin:14px 0 0; }.intro-grid p { margin:0 0 7px; color:#46564e; font-size:18px; }
.feature-showcase { padding-top:100px; padding-bottom:110px; background:var(--white); }.section-heading { max-width:770px; }.feature-rows { margin-top:54px; border-top:1px solid var(--line); }.feature-row { padding:28px 0; display:grid; grid-template-columns:80px 1fr auto; gap:26px; border-bottom:1px solid var(--line); align-items:center; }.feature-row:hover { background:#eef1f0; }.feature-number { font-family:"DM Mono",monospace; color:var(--coral); font-size:13px; }.feature-row h3 { margin:0 0 5px; font-size:21px; }.feature-row p { color:var(--muted); margin:0; max-width:620px; }.feature-row a { font-size:14px; font-weight:800; }.feature-row a span,.text-link--arrow span { color:var(--coral); margin-left:5px; }
.apps-showcase { padding:110px 52px; background:var(--paper); }.apps-heading { max-width:1216px; margin:0 auto 46px; display:grid; grid-template-columns:1fr .68fr; gap:72px; align-items:end; }.apps-heading h2 { font-family:"Source Serif 4",Georgia,serif; line-height:1.02; letter-spacing:0; font-size:clamp(38px,5vw,68px); margin:14px 0 0; }.apps-heading > p { margin:0 0 7px; color:var(--muted); font-size:17px; line-height:1.55; }.app-gallery { max-width:1216px; margin:auto; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }.app-card { overflow:hidden; border:1px solid var(--line); border-radius:8px; background:#e8eeed; }.app-card--planner { background:#ece9e2; }.app-card__copy { padding:34px 34px 28px; }.app-tag { display:inline-block; margin-bottom:14px; color:var(--mint-strong); font-family:"DM Mono",monospace; font-size:12px; font-weight:700; text-transform:uppercase; }.app-card--planner .app-tag { color:var(--coral); }.app-card h3 { max-width:420px; margin:0; font-family:"Source Serif 4",Georgia,serif; font-size:clamp(27px,3vw,39px); line-height:1.03; letter-spacing:0; font-weight:700; }.app-card p { max-width:480px; margin:14px 0 0; color:var(--muted); line-height:1.55; }.app-card img { display:block; width:calc(100% - 34px); margin:0 0 18px 34px; border:1px solid var(--line); border-radius:8px 0 0 0; box-shadow:0 16px 28px rgba(2,55,67,.14); }
.visual-band { padding-top:110px; padding-bottom:110px; display:grid; grid-template-columns:.82fr 1.18fr; gap:65px; align-items:center; background:var(--sand); }.visual-copy h2 { font-family:"Source Serif 4",Georgia,serif; font-size:clamp(36px,4vw,58px); line-height:1.03; margin:14px 0 22px; }.visual-copy p:not(.section-kicker) { color:#506059; font-size:17px; }.visual-frame { border:1px solid #bfc9c1; background:#fff; box-shadow:12px 12px 0 var(--coral); }.visual-frame img { width:100%; display:block; }
.method-band { padding-top:120px; padding-bottom:120px; display:grid; grid-template-columns:.9fr 1.1fr; gap:85px; }.steps { padding:0; margin:0; list-style:none; border-top:1px solid var(--line); }.steps li { padding:21px 0; border-bottom:1px solid var(--line); display:grid; grid-template-columns:44px 1fr; gap:16px; }.steps li > span { font-family:"DM Mono",monospace; color:var(--mint-strong); }.steps h3 { font-size:17px; margin:0 0 5px; }.steps p { margin:0; color:var(--muted); font-size:14px; }
.audience-band { padding-top:95px; padding-bottom:95px; background:var(--ink); color:#fff; display:grid; grid-template-columns:1fr 1fr; gap:80px; }.audience-copy h2 { color:#fff; }.audience-copy .eyebrow { color:var(--mint); }.audience-list { border-top:1px solid #526058; }.audience-list > div { padding:22px 0; border-bottom:1px solid #526058; display:grid; grid-template-columns:150px 1fr; gap:20px; }.audience-list strong { font-family:"Source Serif 4",Georgia,serif; font-size:22px; }.audience-list span { color:#d1dad4; font-size:14px; }
.faq-band { padding-top:115px; padding-bottom:115px; display:grid; grid-template-columns:.78fr 1.22fr; gap:80px; }.faq-list { border-top:1px solid var(--line); }.faq-list details { border-bottom:1px solid var(--line); padding:20px 0; }.faq-list summary { cursor:pointer; list-style:none; display:flex; align-items:center; justify-content:space-between; gap:24px; font-weight:800; }.faq-list summary::-webkit-details-marker { display:none; }.faq-list summary span { color:var(--coral); font-size:22px; font-weight:400; }.faq-list details[open] summary span { transform:rotate(45deg); }.faq-list p { color:var(--muted); margin:15px 38px 0 0; font-size:14px; }
.final-cta { padding-top:120px; padding-bottom:120px; text-align:center; background:var(--mint); }.final-cta .eyebrow { justify-content:center; color:var(--mint-strong); }.final-cta h2 { max-width:780px; margin-left:auto; margin-right:auto; }.final-cta .hero-actions { justify-content:center; }.final-cta .button--ghost { background:transparent; }
.site-footer { max-width:1320px; margin:auto; min-height:150px; padding:32px 52px; display:grid; grid-template-columns:1fr 1.5fr auto; gap:28px; align-items:center; background:var(--paper); }.site-footer p,.site-footer > span { color:var(--muted); margin:0; font-size:13px; }.site-footer > span { font-family:"DM Mono",monospace; }
@media (max-width:850px) { .site-header { padding:0 18px; min-height:64px; }.header-actions { display:none; }.menu-toggle { border:0; background:transparent; display:block; margin-left:auto; font-size:23px; color:var(--ink); }.site-nav { display:none; position:absolute; top:64px; left:0; right:0; padding:16px 18px 20px; flex-direction:column; align-items:flex-start; border-bottom:1px solid var(--line); background:var(--paper); }.site-nav.is-open { display:flex; }.hero,.intro-band,.feature-showcase,.apps-showcase,.visual-band,.method-band,.audience-band,.faq-band,.final-cta { padding-left:24px; padding-right:24px; }.hero { min-height:0; padding-top:72px; }.hero h1 { font-size:clamp(53px,16vw,80px); }.hero-lead { font-size:17px; }.hero-product { margin-top:48px; box-shadow:8px 8px 0 var(--mint); }.hero-product img { aspect-ratio:1.2 / 1; object-fit:cover; object-position:left top; }.product-label { left:8px; top:8px; }.proof-strip { justify-content:flex-start; overflow:auto; gap:14px; white-space:nowrap; }.proof-strip p { font-size:16px; }.intro-band,.feature-showcase,.apps-showcase,.visual-band,.method-band,.faq-band { padding-top:72px; padding-bottom:72px; }.intro-grid,.visual-band,.method-band,.audience-band,.faq-band,.apps-heading,.app-gallery { grid-template-columns:1fr; gap:36px; }.apps-heading { margin-bottom:32px; }.apps-heading > p { margin:0; }.app-card__copy { padding:28px 24px 22px; }.app-card img { width:calc(100% - 24px); margin-left:24px; }.intro-grid p { font-size:16px; }.feature-row { grid-template-columns:42px 1fr; gap:13px; align-items:start; }.feature-row a { grid-column:2; }.visual-band { gap:38px; }.visual-frame { box-shadow:8px 8px 0 var(--coral); }.audience-band { padding-top:72px; padding-bottom:72px; }.audience-list > div { grid-template-columns:1fr; gap:4px; }.site-footer { grid-template-columns:1fr; padding:30px 24px; gap:13px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; transition:none !important; } }