/* Généré par build.py — styles propres au blog et à /apercu. */

/* CTA WhatsApp + e-mail, partage par la home, la 404 et les pages generees */
.contact-cta{margin-top:3.5rem;padding-top:3rem;border-top:1px solid rgba(245,242,236,.12);display:flex;align-items:center;gap:1.5rem 2.5rem;flex-wrap:wrap}
.cta-primary{border:1px solid rgba(245,242,236,.35);color:#f5f2ec;font-family:'Inter Tight','Inter Tight Fallback',sans-serif;font-size:.95rem;font-weight:500;padding:1rem 1.75rem;border-radius:2px;transition:background .3s,color .3s,border-color .3s;display:inline-flex;align-items:center;gap:.75rem;white-space:nowrap}
.cta-primary:hover{background:#f5f2ec;color:#0a0a0a;border-color:#f5f2ec}
.cta-primary svg{width:16px;height:16px;flex-shrink:0}
.cta-primary .arrow{display:inline-block;transition:transform .3s}
.cta-primary:hover .arrow{transform:translateX(4px)}
.cta-secondary{font-size:.92rem;color:rgba(245,242,236,.7);border-bottom:1px solid rgba(245,242,236,.25);padding-bottom:1px;transition:color .3s,border-color .3s}
.cta-secondary:hover{color:#f5f2ec;border-color:#f5f2ec}
.studio-state{opacity:.65;font-variant-numeric:tabular-nums}
.studio-state::before{content:'';display:inline-block;width:5px;height:5px;border-radius:50%;background:#8a8478;margin-right:.5em;vertical-align:middle}
.studio-state.open::before{background:#8ab05c}

/* Transitions entre pages (View Transitions, same-origin) */
@view-transition{navigation:auto}
@media(prefers-reduced-motion:no-preference){
    ::view-transition-old(root){animation:vtOut .22s cubic-bezier(.4,0,1,1) both}
    ::view-transition-new(root){animation:vtIn .32s cubic-bezier(0,0,.2,1) both}
    @keyframes vtOut{to{opacity:0}}
    @keyframes vtIn{from{opacity:0}}
}
@media(prefers-reduced-motion:reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}}
/* le chrome ne clignote pas : il garde son identite d'une page a l'autre */
#nav{view-transition-name:hl-nav}
.wa-float{view-transition-name:hl-wa}
footer{view-transition-name:hl-footer}

/* ============ BLOG ============ */
.post-hero{background:#0a0a0a;color:#f5f2ec;padding:9rem 2rem 5rem;position:relative;overflow:hidden}
.post-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(70vw 70vw at 12% 0%,rgba(138,132,120,.13),transparent 62%);pointer-events:none}
.post-hero-inner{max-width:860px;margin:0 auto;position:relative;z-index:1}
.post-meta-top{display:flex;align-items:baseline;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;margin-bottom:2.5rem}
.post-meta-top .eyebrow{color:#8a8478;margin:0}
.post-back{font-size:.82rem;color:rgba(245,242,236,.6);border-bottom:1px solid rgba(245,242,236,.2);padding-bottom:1px;transition:color .3s,border-color .3s}
.post-back:hover{color:#f5f2ec;border-color:#f5f2ec}
.post-title{font-family:'Inter Tight','Inter Tight Fallback',sans-serif;font-size:clamp(2rem,5vw,3.9rem);font-weight:500;letter-spacing:-.035em;line-height:1.06;margin-bottom:1.75rem;text-wrap:balance;padding-bottom:.08em}
.post-excerpt{font-size:clamp(1rem,1.5vw,1.2rem);line-height:1.6;color:rgba(245,242,236,.72);max-width:62ch}
.post-tags{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:2.25rem}
.post-tag{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(245,242,236,.55);border:1px solid rgba(245,242,236,.22);border-radius:2px;padding:.35rem .85rem}
.post-lang-note{margin-top:2rem;font-size:.82rem;color:rgba(245,242,236,.55);border-left:2px solid rgba(138,132,120,.5);padding-left:.9rem}

.post-body{max-width:68ch;margin:0 auto;padding:5rem 2rem 6rem;font-size:1.06rem;line-height:1.78;color:#2a2a28}
.post-body > *:first-child{margin-top:0}
.post-body p{margin:0 0 1.5rem}
.post-body p:first-of-type{font-size:1.16rem;line-height:1.68;color:#0a0a0a}
.post-body h2{font-family:'Inter Tight','Inter Tight Fallback',sans-serif;font-size:clamp(1.4rem,2.6vw,1.95rem);font-weight:500;letter-spacing:-.025em;line-height:1.2;color:#0a0a0a;margin:3.5rem 0 1.1rem;padding-bottom:.06em}
.post-body h3{font-family:'Inter Tight','Inter Tight Fallback',sans-serif;font-size:1.18rem;font-weight:500;letter-spacing:-.015em;color:#0a0a0a;margin:2.5rem 0 .85rem}
.post-body ul,.post-body ol{margin:0 0 1.5rem;padding-left:1.35rem}
.post-body li{margin-bottom:.6rem}
.post-body li::marker{color:#8a8478}
.post-body strong{font-weight:600;color:#0a0a0a}
.post-body em{font-style:italic}
.post-body a{color:#0a0a0a;border-bottom:1px solid rgba(10,10,10,.28);padding-bottom:1px;transition:border-color .3s}
.post-body a:hover{border-color:#0a0a0a}
.post-body blockquote{margin:2.25rem 0;padding:.25rem 0 .25rem 1.5rem;border-left:2px solid #8a8478;color:#4a4a46;font-style:normal}
.post-body blockquote p:last-child{margin-bottom:0}
.post-body hr{border:0;border-top:1px solid rgba(10,10,10,.12);margin:3rem 0}
.post-body code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em;background:rgba(10,10,10,.05);padding:.15em .4em;border-radius:3px}
.post-body table{width:100%;border-collapse:collapse;margin:2rem 0;font-size:.95rem;display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
@media(min-width:760px){.post-body table{display:table}}
.post-body th,.post-body td{white-space:normal;min-width:9rem}
.post-body th,.post-body td{text-align:left;padding:.7rem .9rem;border:1px solid rgba(10,10,10,.12);vertical-align:top}
.post-body th{background:rgba(10,10,10,.04);font-weight:500;font-family:'Inter Tight','Inter Tight Fallback',sans-serif}
.post-disclaimer{max-width:68ch;margin:0 auto;padding:0 2rem 5rem;font-size:.85rem;line-height:1.6;color:#6a6a66}

/* index du blog */
.blog-hero{background:#0a0a0a;color:#f5f2ec;padding:9rem 2rem 5rem;position:relative;overflow:hidden}
.blog-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(70vw 70vw at 12% 0%,rgba(138,132,120,.13),transparent 62%);pointer-events:none}
.blog-hero-inner{max-width:1600px;margin:0 auto;position:relative;z-index:1}
.blog-hero .eyebrow{color:#8a8478;margin-bottom:2.5rem}
.blog-hero h1{font-family:'Inter Tight','Inter Tight Fallback',sans-serif;font-size:clamp(2.2rem,6.2vw,5.6rem);font-weight:500;letter-spacing:-.035em;line-height:1.04;margin-bottom:1.5rem;text-wrap:balance;padding-bottom:.08em}
.blog-hero h1 em{font-style:normal;color:#8a8478}
.blog-hero p{max-width:56ch;color:rgba(245,242,236,.7);line-height:1.65}
.post-list{max-width:1000px;margin:0 auto;padding:6rem 2rem 7rem}
.post-card{display:block;padding:2.5rem 0;border-bottom:1px solid rgba(10,10,10,.12);transition:padding-left .4s cubic-bezier(.2,.7,.2,1)}
.post-card:first-child{border-top:1px solid rgba(10,10,10,.12)}
.post-card:hover{padding-left:1rem}
.post-card-meta{display:flex;align-items:center;gap:.75rem;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#8a8478;margin-bottom:.9rem}
.post-card h2{font-family:'Inter Tight','Inter Tight Fallback',sans-serif;font-size:clamp(1.3rem,2.6vw,1.9rem);font-weight:500;letter-spacing:-.025em;line-height:1.2;color:#0a0a0a;margin-bottom:.6rem;padding-bottom:.06em}
.post-card p{color:#4a4a46;line-height:1.6;max-width:66ch;margin-bottom:.9rem}
.post-card-more{font-size:.85rem;color:#0a0a0a;display:inline-flex;align-items:center;gap:.45rem}
.post-card-more .arrow{transition:transform .3s}
.post-card:hover .post-card-more .arrow{transform:translateX(4px)}
.blog-empty{max-width:1000px;margin:0 auto;padding:6rem 2rem;color:#6a6a66}

@media(max-width:700px){
.post-hero,.blog-hero{padding:7rem 1.5rem 3.5rem}
.post-body{padding:3.5rem 1.5rem 4rem;font-size:1.02rem}
.post-disclaimer{padding:0 1.5rem 3.5rem}
.post-list{padding:3.5rem 1.5rem 5rem}
.post-card{padding:2rem 0}
.post-card:hover{padding-left:0}
}


.ap-hero-inner{display:grid;grid-template-columns:1fr minmax(0,34%);gap:3rem 4rem;align-items:start}
.ap-hero-inner>.eyebrow,.ap-hero-inner>h1,.ap-hero-inner>.ap-sub,.ap-hero-inner>.ap-form,.ap-hero-inner>.ap-note{grid-column:1}
.ap-shot{grid-column:2;grid-row:1/span 5;margin:0;align-self:center}
.ap-shot img{width:100%;height:auto;display:block;border:1px solid rgba(245,242,236,.1)}
.ap-shot figcaption{margin-top:.85rem;font-size:.76rem;line-height:1.5;color:rgba(245,242,236,.5)}
@media(max-width:900px){.ap-hero-inner{grid-template-columns:1fr}.ap-shot{grid-column:1;grid-row:auto;max-width:300px;margin-top:2rem}}
/* ============ APERÇU GRATUIT ============ */
.ap-hero{background:#0a0a0a;color:#f5f2ec;padding:9rem 2rem 5.5rem;position:relative;overflow:hidden}
.ap-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(70vw 70vw at 12% 0%,rgba(138,132,120,.13),transparent 62%);pointer-events:none}
.ap-hero-inner{max-width:980px;margin:0 auto;position:relative;z-index:1}
.ap-hero .eyebrow{color:#8a8478;margin-bottom:2.5rem}
.ap-hero h1{font-family:'Inter Tight','Inter Tight Fallback',sans-serif;font-size:clamp(2.1rem,5.6vw,4.6rem);font-weight:500;letter-spacing:-.035em;line-height:1.05;margin-bottom:1.6rem;text-wrap:balance;padding-bottom:.08em}
.ap-hero h1 em{font-style:normal;color:#8a8478}
.ap-hero .ap-sub{max-width:56ch;color:rgba(245,242,236,.72);line-height:1.65;font-size:1.05rem}
.ap-form{margin-top:3.25rem;display:flex;gap:1rem;flex-wrap:wrap;align-items:flex-start;max-width:640px}
.ap-input-wrap{flex:1 1 300px;display:flex;flex-direction:column;gap:.5rem}
.ap-form label{font-size:.7rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;opacity:.5;font-family:'Inter','Inter Fallback',sans-serif}
.ap-form input{background:transparent;border:0;border-bottom:1px solid rgba(245,242,236,.28);color:#f5f2ec;font-family:'Inter Tight','Inter Tight Fallback',sans-serif;font-size:1.1rem;font-weight:500;padding:.6rem 0 .7rem;width:100%;transition:border-color .3s}
.ap-form input:focus{outline:none;border-bottom-color:#f5f2ec}
.ap-form input::placeholder{color:rgba(245,242,236,.3)}
.ap-submit{background:transparent;border:1px solid rgba(245,242,236,.35);color:#f5f2ec;font-family:'Inter Tight','Inter Tight Fallback',sans-serif;font-size:.95rem;font-weight:500;padding:1rem 1.6rem;border-radius:2px;cursor:pointer;transition:background .3s,color .3s,border-color .3s;display:inline-flex;align-items:center;gap:.7rem;white-space:nowrap;margin-top:1.55rem}
.ap-submit:hover{background:#f5f2ec;color:#0a0a0a;border-color:#f5f2ec}
.ap-submit svg{width:16px;height:16px;flex-shrink:0}
.ap-submit .arrow{transition:transform .3s}
.ap-submit:hover .arrow{transform:translateX(4px)}
.ap-note{margin-top:1.4rem;font-size:.8rem;color:rgba(245,242,236,.5);line-height:1.55;max-width:52ch}
.ap-steps{max-width:1100px;margin:0 auto;padding:6rem 2rem}
.ap-step-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:3rem;margin-top:3rem}
.ap-step-num{font-family:'Inter Tight','Inter Tight Fallback',sans-serif;font-size:.78rem;letter-spacing:.16em;color:#8a8478;margin-bottom:1rem}
.ap-step h3{font-family:'Inter Tight','Inter Tight Fallback',sans-serif;font-size:1.22rem;font-weight:500;letter-spacing:-.02em;color:#0a0a0a;margin-bottom:.7rem;padding-bottom:.05em}
.ap-step p{color:#4a4a46;line-height:1.65;font-size:.96rem}
.ap-facts{background:#0a0a0a;color:#f5f2ec;padding:6rem 2rem}
.ap-facts-inner{max-width:1100px;margin:0 auto}
.ap-facts .eyebrow{color:#8a8478;margin-bottom:2.5rem}
.ap-fact-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2.5rem 3.5rem}
.ap-fact dt{font-family:'Inter Tight','Inter Tight Fallback',sans-serif;font-size:1.05rem;font-weight:500;margin-bottom:.5rem}
.ap-fact dd{margin:0;color:rgba(245,242,236,.65);line-height:1.6;font-size:.94rem}
@media(max-width:900px){.ap-step-grid{grid-template-columns:1fr;gap:2.5rem}.ap-fact-grid{grid-template-columns:1fr;gap:2rem}}
@media(max-width:700px){.ap-hero{padding:7rem 1.5rem 4rem}.ap-steps,.ap-facts{padding:4rem 1.5rem}.ap-form{flex-direction:column}.ap-submit{margin-top:.5rem;width:100%;justify-content:center}}