/* ========= NOUVELLE DA v2 — extrême : grain, difference, dégradés, encrage ========= */
:root{--grain-opacity:0.09;}
.display,h1,h2,h3,.ed-hero-title,.stack-num,.ms-num,.hero-title{letter-spacing:-0.03em;}

/* ---- FOND : dégradés radiaux granuleux (zones sombres/claires) ---- */
html{background:var(--bg);}
body{position:relative;}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,0.05),rgba(0,0,0,0.18));}
[data-theme="light"] body::before{background:linear-gradient(180deg,rgba(255,255,255,0.05),rgba(255,255,255,0.0));}

/* ---- GRAIN lourd ---- */
body::after{
  content:"";position:fixed;inset:-50%;width:200%;height:200%;z-index:9997;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  opacity:var(--grain-opacity);mix-blend-mode:overlay;animation:grain-shift .55s steps(2) infinite;
}
[data-theme="light"] body::after{mix-blend-mode:multiply;opacity:calc(var(--grain-opacity)*0.75);}
@keyframes grain-shift{0%{transform:translate(0,0)}50%{transform:translate(-2%,1%)}100%{transform:translate(1%,-1%)}}
@media (prefers-reduced-motion:reduce){body::after{animation:none;}}

/* points d'encrage retirés */

/* --- fond texturé sur l'élément de fond fixe existant du site --- */
#hero-fixed-bg{background:url("../bg/grain-dark.webp") center center / cover no-repeat, var(--bg)!important;}
[data-theme="light"] #hero-fixed-bg{background:url("../bg/grain-light.webp") center center / cover no-repeat, var(--bg)!important;}

/* --- laisser voir la texture de fond sur tout le site --- */
body{background:transparent!important;}
#view-home,#view-detail,#view-services,#view-testimonials,#resume-section,.services-summary,.services-summary-inner,#services-summary,.ed-page{background:transparent!important;}

/* ============ INVERSION (difference) SUR TOUT LE TEXTE ============ */
/* plus d'isolation : le texte se mélange avec le fond texturé */
.hero,.stack-sticky,#method{isolation:auto!important;}
/* Nike / showcase : laisser voir la texture de fond */
.sc-stage{background:transparent!important;}

/* tout le texte en blanc + difference => s'inverse contre le fond derrière lui */
.num,.tag,
h1,h2,h3,h4,h5,h6,
.hero-title,.hero-sub,.hero-meta,.hero-meta *,
.ed-hero-title,.ed-hero-sub,
.section-head h2,
.stack-num,.stack-title,.stack-cat,.stack-year,.stack-desc,
.mw-name,.mw-year,.mw-cat,.mw-arrow,
.ms-num,.ms-body h3,.ms-body p,
.faq-q,.faq-q *,.faq-a,.faq-a *,
.tc-quote,.tc-name,.tc-role,.tc-company-link,.testimonials-authentic,
.btn-view-all,.service-panel h3,.service-panel p,.service-tag,
.ed-block-title,.ed-block-text,.ed-block h3,.ed-block p,.ed-spec-row,.ed-spec-row *,.ed-pipeline,.ed-pipeline *,.ed-caption,.ed-brand-note,.ed-footer-nav a,.ed-footer-nav a *,.ed-tag,.ed-section-tag,
.resume-item,.resume-item *,.about-heading,.studio-name,.designer-label,
.footer-legal-link,.footer-col,.footer-col *,
nav a,nav a *,.lang-btn,
p{
  color:#fff !important;
  mix-blend-mode:difference;
}


/* === FIX difference : neutraliser les transforms qui isolent le texte de la texture === */
.reveal, .reveal.in{transform:none !important; will-change:auto !important;}
.reveal .mw-item-inner, .reveal.in .mw-item-inner{transform:none !important;}
.ed-reveal,.ed-reveal-l,.ed-reveal-r,.ed-reveal-row,
.ed-reveal.in,.ed-reveal-l.in,.ed-reveal-r.in,.ed-reveal-row.in{transform:none !important;}
/* forcer TOUT le texte en blanc net (les demi-teintes s'inversent aussi) */
.section-head h2 *, h1 *, h2 *, h3 *, .hero-title *, .ed-hero-title *,
.mw-name *, .mw-cat *, .mw-year *, p *, .tag *{color:#fff !important;}


/* === LIGNES de séparation en difference (s'inversent contre le fond) === */
.mw-item{border-bottom:none!important; position:relative;}
.mw-item::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:#fff;mix-blend-mode:difference;pointer-events:none;}
.more-work-list{border-top:none!important; position:relative;}
.more-work-list::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:#fff;mix-blend-mode:difference;pointer-events:none;}
.hero-meta{border-top:none!important; position:relative;}
.hero-meta::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:#fff;mix-blend-mode:difference;pointer-events:none;}
.section-head, .faq-list, .faq-item, .method-steps, .method-step{position:relative;}
.faq-item{border-bottom:none!important;}
.faq-item::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:#fff;mix-blend-mode:difference;pointer-events:none;}
.method-step{border-bottom:none!important;}
.method-step::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:#fff;mix-blend-mode:difference;pointer-events:none;}


/* ===== FINITION DIFFERENCE : plus de gris, étiquettes en encadré ===== */
/* 1) TOUT le texte du contenu en blanc net (fini les gris du CV/à-propos/meta) */
#view-home *,#view-services *,#view-testimonials *,footer *{color:#fff !important;}
/* 2) difference sur les blocs de texte CV/à-propos (chaque bloc = un groupe, pas de compoundage) */
.about-company-name,.about-bio,.about-name,.about-designer-tag,.about-heading,.about-intro,.about-meta-row,.resume-item,.toolkit,.meta-available{mix-blend-mode:difference;}
.about-company-name *,.about-bio *,.about-intro *,.about-meta-row *,.resume-item *,.toolkit *,.meta-available *{mix-blend-mode:normal !important;}
/* 3) ETIQUETTES / BADGES / BOUTONS : encadré, pas de fond, texte en difference */
.has-3d,.has-video,.mw-3d-badge,.mw-video-badge,.fw-feature-tag,.ed-hero-tag,.ed-feature-tag,.btn-view-all,#services-summary .btn-view-all,.ed-back-btn,.back-link,.lang-btn,.stack-cat,.stack-year,.mw-cat{
  background:transparent !important;
  border:1px solid #fff !important;
  color:#fff !important;
}
.has-3d,.has-video,.mw-3d-badge,.mw-video-badge,.fw-feature-tag,.ed-hero-tag,.ed-feature-tag,.btn-view-all,#services-summary .btn-view-all,.ed-back-btn,.back-link,.lang-btn{
  mix-blend-mode:difference !important;
}
img,svg,canvas,video{mix-blend-mode:normal !important;}

/* deck animé empilé : pas de difference (cartes superposées -> fantômes) */
.stack-num,.stack-title,.stack-cat,.stack-year,.stack-desc,.stack-card,.stack-card *{mix-blend-mode:normal!important;}
.stack-title,.stack-num{color:#fff!important;}
/* HORS difference : médias, vignettes, icônes, badges, la texture elle-même */
img,svg,canvas,video,
.mw-thumb,.mw-thumb *,.stack-media,.stack-media *,.ed-hero img,.detail-hero img,.fw-hero-media img,
#hero-fixed-bg,.mw-3d-badge,.mw-video-badge,.has-3d,.dot{
  mix-blend-mode:normal !important;
}

/* ---- EFFET DIFFERENCE : grands textes blanc sur sombre / sombre sur clair ---- */
.hero{background:transparent!important;isolation:isolate;}
h1.hero-title,h1.hero-title em{color:#fff!important;}
h1.hero-title{mix-blend-mode:difference;position:relative;z-index:4;}
.ed-hero-title,.ed-hero-title em{color:#fff!important;}
.ed-hero-title{mix-blend-mode:difference;}
.section-head h2{color:#fff!important;mix-blend-mode:difference;}
.ms-num,.stack-num{color:#fff!important;mix-blend-mode:difference;}

/* ---- CHIFFRES GÉANTS exagérés ---- */
.ms-num{font-size:clamp(70px,11vw,168px)!important;line-height:0.78!important;opacity:1!important;}
.stack-num{font-size:clamp(22px,3vw,44px)!important;letter-spacing:0.02em;}

/* ---- NAV verre dépoli + labels mono ---- */
nav{backdrop-filter:blur(16px) saturate(120%);-webkit-backdrop-filter:blur(16px) saturate(120%);background:color-mix(in srgb, var(--bg) 55%, transparent)!important;}
.num{font-family:'Space Mono',monospace!important;}

/* ---- TAGS mono + crochet de focus ---- */
.tag{font-family:'Space Mono',monospace!important;letter-spacing:0.24em!important;position:relative;padding-left:18px;}
.tag::before{content:"";position:absolute;left:0;top:50%;width:10px;height:10px;border-left:1px solid var(--fg);border-top:1px solid var(--fg);transform:translateY(-50%);opacity:0.7;}

/* ---- CADRES DE FOCUS (crochets d'angle) sur médias & panneaux ---- */
.stack-media,.ed-hero,.fw-hero-media,.detail-hero,.service-panel{position:relative;}
.stack-media::after,.ed-hero::after,.service-panel::after{
  content:"";position:absolute;inset:12px;pointer-events:none;z-index:4;
  background:
    linear-gradient(#fff,#fff) 0 0/26px 1.5px no-repeat, linear-gradient(#fff,#fff) 0 0/1.5px 26px no-repeat,
    linear-gradient(#fff,#fff) 100% 0/26px 1.5px no-repeat, linear-gradient(#fff,#fff) 100% 0/1.5px 26px no-repeat,
    linear-gradient(#fff,#fff) 0 100%/26px 1.5px no-repeat, linear-gradient(#fff,#fff) 0 100%/1.5px 26px no-repeat,
    linear-gradient(#fff,#fff) 100% 100%/26px 1.5px no-repeat, linear-gradient(#fff,#fff) 100% 100%/1.5px 26px no-repeat;
  mix-blend-mode:difference;opacity:0.9;
}

/* ---- accent-bg -> encre foncée ---- */
.btn-view-all:hover,#services-summary .btn-view-all,.msg-form button,.fw-feature-tag{color:var(--accent-ink)!important;}
.price-card.selected,.price-card.selected *,.presta-select-card.active,.presta-select-card.active *{color:var(--accent-ink)!important;}
::selection{background:var(--red);color:var(--accent-ink);}


/* ===== CORRECTIF v3 : boutons blancs, feuilles de texte, formulaire ===== */
/* boutons encadrés : texte BLANC (annule accent-ink) -> réagit au fond */
.btn-view-all,#services-summary .btn-view-all,.msg-form button,.msg-form button *{
  color:#fff !important; background:transparent !important; border:1px solid #fff !important; mix-blend-mode:difference !important;
}
/* feuilles de texte CV / A PROPOS en difference (le texte est dans les enfants) */
.r-date,.r-title,.r-sub,.resume-col h3,
.about-company-name,.about-name,.about-designer-tag,.about-heading,.about-bio,.about-intro p,
.about-meta-row .label,.about-meta-row .value,
.meta-available,.toolkit-wrap span,.toolkit-wrap a,.toolkit-wrap div,.toolkit span,.studio-name,.designer-label{
  mix-blend-mode:difference !important; color:#fff !important;
}
/* FORMULAIRE de contact : champs + placeholders + labels + statut + liens en blanc + difference */
.msg-form input,.msg-form textarea{background:transparent !important; border:none !important; border-bottom:1px solid rgba(255,255,255,0.28) !important; color:#fff !important; mix-blend-mode:difference !important;}
.msg-form input::placeholder,.msg-form textarea::placeholder{color:#fff !important; opacity:0.6;}
.msg-form label,.form-status,.form-status *,.contact-links a,.contact-links a *,.contact-inner p,.contact-inner span{color:#fff !important; mix-blend-mode:difference !important;}


/* ===== CORRECTIF v4 ===== */
/* Nike showcase : fond transparent (laisser la texture) */
.sc-page{background:transparent !important;}
.sc-loading{background:transparent !important;}
/* image de profil : jamais en difference */
.about-photo,.about-photo img{mix-blend-mode:normal !important;}
/* "Autres explorations" : catégorie centrale = texte simple, PAS d'encadré */
.mw-cat{background:transparent !important; border:none !important; padding:0 !important;}


/* médias jamais en difference (sécurité) */
img,canvas,svg,video,picture,.ed-3d-canvas,.sc-canvas,.ed-3d-viewer,.ed-hero-float,.ed-float-img{mix-blend-mode:normal !important;}


/* ===== DECK (6 projets) : lisible dans les 2 modes (composant isolé) — scoping #work pour battre '#view-home *' ===== */
#work .stack-title,#work .stack-cat,#work .stack-year,#work .stack-desc,#work .stack-num,#work .stack-text-link,#work .stack-text-link *{color:#fff !important; mix-blend-mode:normal !important;}
[data-theme="light"] #work .stack-title,[data-theme="light"] #work .stack-cat,[data-theme="light"] #work .stack-year,[data-theme="light"] #work .stack-desc,[data-theme="light"] #work .stack-num,[data-theme="light"] #work .stack-text-link,[data-theme="light"] #work .stack-text-link *{color:#0d0d0f !important;}
#work .stack-nav-btn{color:#fff !important; border:1px solid #fff !important; background:transparent !important; mix-blend-mode:normal !important;}
#work .stack-nav-btn svg{stroke:#fff !important; fill:#fff !important;}
[data-theme="light"] #work .stack-nav-btn{color:#0d0d0f !important; border-color:#0d0d0f !important;}
[data-theme="light"] #work .stack-nav-btn svg{stroke:#0d0d0f !important; fill:#0d0d0f !important;}
#work .stack-cat,#work .stack-year{border-color:currentColor !important;}


/* couleur du texte du modal légal (bat '#view-home *') */
#legal-modal .legal-box,#legal-modal .legal-box h3,#legal-modal .legal-content h4,#legal-modal .legal-content p,#legal-modal .legal-content strong,#legal-modal .legal-close{color:#ededed !important;}
[data-theme="light"] #legal-modal .legal-box,[data-theme="light"] #legal-modal .legal-box h3,[data-theme="light"] #legal-modal .legal-content h4,[data-theme="light"] #legal-modal .legal-content p,[data-theme="light"] #legal-modal .legal-content strong,[data-theme="light"] #legal-modal .legal-close{color:#0d0d0f !important;}


/* ============ CORRECTIF v5 (7 points) ============ */
/* --- P3 : swap photo profil selon thème, jamais en difference --- */
.about-photo .profil-day{display:none;}
[data-theme="light"] .about-photo .profil-night{display:none;}
[data-theme="light"] .about-photo .profil-day{display:block;}
.about-photo,.about-photo img,.profil-img{mix-blend-mode:normal !important;}

/* --- P1 : modal légal = vrai carré, sans flou, ombre portée, police réduite --- */
.legal-modal{backdrop-filter:none !important;-webkit-backdrop-filter:none !important;background:rgba(0,0,0,0.32) !important;}
[data-theme="light"] .legal-modal{background:rgba(120,120,128,0.18) !important;}
.legal-box{width:min(660px,86vh) !important;aspect-ratio:1/1 !important;max-height:90vh !important;overflow:hidden !important;padding:44px 46px !important;box-shadow:0 18px 40px rgba(0,0,0,0.5) !important;}
[data-theme="light"] .legal-box{box-shadow:0 18px 40px rgba(0,0,0,0.28) !important;}
.legal-box h3{font-size:clamp(20px,2vw,26px) !important;margin:0 0 16px !important;}
.legal-content h4{font-size:12px !important;margin:12px 0 1px !important;}
.legal-content p{font-size:12px !important;line-height:1.4 !important;}

/* --- P4 : boutons flottants (mail, haut de page, retour) : pas de fond, en difference --- */
.back-to-top,.to-contact,.back-link{background:transparent !important;border:1px solid #fff !important;color:#fff !important;mix-blend-mode:difference !important;backdrop-filter:none !important;}
.back-to-top svg,.to-contact svg,.back-link svg{stroke:#fff !important;fill:none !important;mix-blend-mode:normal;}

/* --- P5 : les + de la FAQ en difference --- */
.faq-icon{mix-blend-mode:difference !important;}
.faq-icon::before,.faq-icon::after{background:#fff !important;}

/* --- P7 : hero Nike (showcase) : blanc en nuit, noir en jour --- */
.sc-title,.sc-title-lg,.sc-sub,.sc-cta,.sc-hint,.sc-hint-drag,.sc-idx{color:#fff !important;mix-blend-mode:normal !important;}
[data-theme="light"] .sc-title,[data-theme="light"] .sc-title-lg,[data-theme="light"] .sc-sub,[data-theme="light"] .sc-cta,[data-theme="light"] .sc-hint,[data-theme="light"] .sc-hint-drag,[data-theme="light"] .sc-idx{color:#0d0d0f !important;}


/* ============ CORRECTIF v6 ============ */
/* Showcase Nike : tout le texte per-theme (isolé par transforms) */
.sc-title,.sc-title-lg,.sc-sub,.sc-cta,.sc-hint-drag,.sc-idx,.sc-big,.sc-cap,.sc-cap-final,.sc-cap-hero,.sc-cap-left,.sc-cap-right,.sc-cap-side,.sc-eyebrow,.sc-line,.sc-pct,.sc-text,.sc-unit{color:#fff !important;mix-blend-mode:normal !important;}
[data-theme="light"] .sc-title,[data-theme="light"] .sc-title-lg,[data-theme="light"] .sc-sub,[data-theme="light"] .sc-cta,[data-theme="light"] .sc-hint-drag,[data-theme="light"] .sc-idx,[data-theme="light"] .sc-big,[data-theme="light"] .sc-cap,[data-theme="light"] .sc-cap-final,[data-theme="light"] .sc-cap-hero,[data-theme="light"] .sc-cap-left,[data-theme="light"] .sc-cap-right,[data-theme="light"] .sc-cap-side,[data-theme="light"] .sc-eyebrow,[data-theme="light"] .sc-line,[data-theme="light"] .sc-pct,[data-theme="light"] .sc-text,[data-theme="light"] .sc-unit{color:#0d0d0f !important;}
/* Contact : liens + bouton envoyer per-theme (fiable) */
.contact-links a,.contact-links a *,.msg-form button,.msg-form button *{mix-blend-mode:normal !important;color:#fff !important;}
.msg-form button{background:transparent !important;border:1px solid #fff !important;}
[data-theme="light"] .contact-links a,[data-theme="light"] .contact-links a *,[data-theme="light"] .msg-form button,[data-theme="light"] .msg-form button *{color:#0d0d0f !important;}
[data-theme="light"] .msg-form button{border-color:#0d0d0f !important;}
/* Profil : jamais en difference (neutralise ancêtres) */
.about-intro,.about-photo,.about-photo *,.profil-img,.profil-night,.profil-day{mix-blend-mode:normal !important;}
/* Boutons retour unifiés (style Nike : transparent + bordure + difference) */
.ed-back-btn,.back-link,.sc-back{background:transparent !important;border:1px solid #fff !important;color:#fff !important;mix-blend-mode:difference !important;backdrop-filter:none !important;}


/* ============ CORRECTIF v6 ============ */
/* P7 SHOWCASE Nike : texte par thème (scope #view-detail bat '#view-detail *') */
#view-detail .sc-title,#view-detail .sc-title *,#view-detail .sc-title-lg,#view-detail .sc-title-lg *,#view-detail .sc-sub,#view-detail .sc-sub *,#view-detail .sc-cta,#view-detail .sc-cta *,#view-detail .sc-hint-drag,#view-detail .sc-hint-drag *,#view-detail .sc-eyebrow,#view-detail .sc-eyebrow *,#view-detail .sc-big,#view-detail .sc-big *,#view-detail .sc-cap,#view-detail .sc-cap *,#view-detail .sc-cap-final,#view-detail .sc-cap-final *,#view-detail .sc-cap-hero,#view-detail .sc-cap-hero *,#view-detail .sc-cap-left,#view-detail .sc-cap-left *,#view-detail .sc-cap-right,#view-detail .sc-cap-right *,#view-detail .sc-cap-side,#view-detail .sc-cap-side *,#view-detail .sc-text,#view-detail .sc-text *,#view-detail .sc-pct,#view-detail .sc-pct *,#view-detail .sc-unit,#view-detail .sc-unit *,#view-detail .sc-line,#view-detail .sc-line *,#view-detail .sc-idx,#view-detail .sc-idx *{color:#fff !important;mix-blend-mode:normal !important;}
[data-theme="light"] #view-detail .sc-title,[data-theme="light"] #view-detail .sc-title *,[data-theme="light"] #view-detail .sc-title-lg,[data-theme="light"] #view-detail .sc-title-lg *,[data-theme="light"] #view-detail .sc-sub,[data-theme="light"] #view-detail .sc-sub *,[data-theme="light"] #view-detail .sc-cta,[data-theme="light"] #view-detail .sc-cta *,[data-theme="light"] #view-detail .sc-hint-drag,[data-theme="light"] #view-detail .sc-hint-drag *,[data-theme="light"] #view-detail .sc-eyebrow,[data-theme="light"] #view-detail .sc-eyebrow *,[data-theme="light"] #view-detail .sc-big,[data-theme="light"] #view-detail .sc-big *,[data-theme="light"] #view-detail .sc-cap,[data-theme="light"] #view-detail .sc-cap *,[data-theme="light"] #view-detail .sc-cap-final,[data-theme="light"] #view-detail .sc-cap-final *,[data-theme="light"] #view-detail .sc-cap-hero,[data-theme="light"] #view-detail .sc-cap-hero *,[data-theme="light"] #view-detail .sc-cap-left,[data-theme="light"] #view-detail .sc-cap-left *,[data-theme="light"] #view-detail .sc-cap-right,[data-theme="light"] #view-detail .sc-cap-right *,[data-theme="light"] #view-detail .sc-cap-side,[data-theme="light"] #view-detail .sc-cap-side *,[data-theme="light"] #view-detail .sc-text,[data-theme="light"] #view-detail .sc-text *,[data-theme="light"] #view-detail .sc-pct,[data-theme="light"] #view-detail .sc-pct *,[data-theme="light"] #view-detail .sc-unit,[data-theme="light"] #view-detail .sc-unit *,[data-theme="light"] #view-detail .sc-line,[data-theme="light"] #view-detail .sc-line *,[data-theme="light"] #view-detail .sc-idx,[data-theme="light"] #view-detail .sc-idx *{color:#0d0d0f !important;}
/* P1 contact : liens/bouton/labels en difference (scope #contact) */
#contact .contact-links a,#contact .contact-links a *,#contact .msg-form button,#contact .msg-form button *,#contact .msg-form label,#contact .form-status,#contact .form-status *{color:#fff !important;mix-blend-mode:difference !important;}
/* P3 profil : isolation pour ne pas hériter d'une difference d'ancêtre */
.about-photo{isolation:isolate !important;}
.about-photo,.about-photo *,.profil-img{mix-blend-mode:normal !important;}
/* P4 back-link -> style .ed-back-btn (Nike) */
.back-link{top:26px !important;left:26px !important;background:transparent !important;border:1px solid #fff !important;color:#fff !important;mix-blend-mode:difference !important;backdrop-filter:none !important;padding:11px 16px !important;}