/* Direction éditoriale MCE : bleu encre, papier bleuté et accents cyan. */
:root { --mce-ink:#143b5e; --mce-paper:#eff5fa; --mce-line:#cbd9e4; }
.mce-wrap { width:min(1180px,calc(100% - 64px)); margin-inline:auto; }
.mce-section { padding:96px 0; background:var(--mce-paper); }
.mce-eyebrow { font-size:11px; font-weight:600; letter-spacing:.17em; line-height:1.6; color:#4d7795; margin:0 0 22px; }
.mce-section h2,.official-copy h2 { color:var(--mce-ink); font-size:clamp(30px,3.4vw,46px); line-height:1.13; letter-spacing:-.045em; font-weight:600; }
.mce-section em,.mce-final em,.contact-heading em { font-style:normal; color:#00b5f2; }
.mce-section-heading { display:flex; justify-content:space-between; gap:48px; align-items:flex-end; margin-bottom:48px; }
.mce-section-heading > p { font-size:15px; line-height:1.8; max-width:345px; color:#597084; }
.mce-button { display:inline-flex; justify-content:center; align-items:center; gap:26px; padding:16px 21px; min-height:52px; border-radius:6px; background:#14c4ef; color:#092d48; font-size:13px; font-weight:700; transition:background .2s,transform .2s; }
.mce-button:hover { background:#7ae0f7; transform:translateY(-2px); }
.mce-button-outline { border:1px solid #a4c7db66; background:transparent; color:white; }
.mce-button-outline:hover { background:#ffffff16; }
.mce-button-dark { background:var(--mce-ink); color:white; }
.mce-button-dark:hover { background:#286c91; }
.mce-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }
.mce-text-link { display:inline-block; padding:9px 0; color:#194c6e; border-bottom:1px solid #86a8bd; font-size:14px; font-weight:600; }
.mce-hero { background:#0a2a45; color:white; padding:135px 0 0; overflow:hidden; }
.hero-layout { display:grid; grid-template-columns:1.05fr 1fr; gap:30px; align-items:center; padding-bottom:50px; min-height:640px; }
.mce-hero .mce-eyebrow { color:#81bed8; }
.hero-copy h1 { font-size:clamp(42px,5.4vw,74px); letter-spacing:-.055em; line-height:1.05; font-weight:600; }
.hero-copy h1 em { font-style:normal; color:#65d6f0; }
.hero-lead { max-width:420px; font-size:16px; line-height:1.8; color:#adc4d5; margin:24px 0; }
.hero-signature { font-size:11px; color:#adc4d5; margin-top:30px; letter-spacing:.03em; }
.hero-signature span { display:inline-block; width:6px; height:6px; border-radius:50%; background:#66d8f0; margin-right:6px; }
.hero-composition { position:relative; height:475px; }
.hero-orbit { position:absolute; inset:0; border:1px solid #7fbed22e; border-radius:50%; transform:rotate(-25deg) scale(.96,.82); }
.hero-composition figure { position:absolute; margin:0; border:1px solid #7997ad66; box-shadow:0 20px 60px #00172b66; background:#f1f5f8; color:#24415a; overflow:hidden; }
.hero-web { top:35px; left:4%; width:82%; transform:rotate(-5deg); border-radius:8px; animation:hero-web-float 8s ease-in-out infinite; }
.mini-browser { height:28px; background:#f3f6f9; display:flex; align-items:center; gap:4px; padding:0 12px; border-bottom:1px solid #d7e0e8; }
.mini-browser i { width:5px; height:5px; border-radius:50%; background:#9db2c2; }
.mini-browser span { margin-left:10px; color:#5b7283; font-size:9px; }
.hero-web-screen { aspect-ratio:1.7; overflow:hidden; }
.hero-web-screen img { width:100%; height:auto; }
.hero-composition figcaption { font-size:9px; letter-spacing:.12em; padding:10px 14px; }
.hero-brand { left:0; bottom:40px; width:39%; transform:rotate(-10deg); animation:hero-brand-float 8s ease-in-out infinite; }
.hero-brand img { width:100%; aspect-ratio:1.2; object-fit:cover; }
.hero-print { right:0; bottom:10px; width:34%; transform:rotate(8deg); animation:hero-print-float 8s ease-in-out infinite; }
.hero-print img { width:100%; height:205px; object-fit:cover; object-position:top; }
.hero-spark { position:absolute; right:1%; top:7px; font-size:68px; color:#6ed9ef; }
.hero-motion { position:absolute; bottom:-30px; right:0; padding:10px; color:#b6cfdd; font-size:10px; text-decoration:underline; }
.hero-composition.is-paused figure { animation-play-state:paused; }
.hero-bottom { padding:24px 0; display:flex; justify-content:space-between; gap:20px; border-top:1px solid #aac8dc33; color:#99b9cc; font-size:10px; letter-spacing:.08em; }
.hero-bottom a { color:#d1e5ee; }
@keyframes hero-web-float { 50% { transform:translateY(-12px) rotate(-3deg); } }
@keyframes hero-brand-float { 50% { transform:translateY(9px) rotate(-6deg); } }
@keyframes hero-print-float { 50% { transform:translateY(-10px) rotate(5deg); } }
.expertise-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); border:1px solid var(--mce-line); }
.expertise-card { position:relative; padding:24px 20px; border-right:1px solid var(--mce-line); transition:background .2s; display:flex; flex-direction:column; }
.expertise-card:last-child { border:0; }
.expertise-card:hover { background:#fff; }
.expertise-icon { color:#237292; font-size:32px; margin-bottom:35px; }
.expertise-index { position:absolute; right:16px; top:28px; font-size:10px; color:#698598; }
.expertise-card h3 { font-size:18px; line-height:1.3; letter-spacing:-.03em; color:var(--mce-ink); min-height:48px; font-weight:600; }
.expertise-card p { font-size:12px; line-height:1.7; color:#5d7588; margin:12px 0 24px; }
.expertise-link { margin-top:auto; display:flex; justify-content:space-between; color:#245b7c; font-size:11px; }
.selection-section { background:#e7f0f7; }
.selection-section .web-project-grid { max-width:100%; }
.home-more-sites { display:flex; justify-content:center; margin:30px 0 50px; }
.home-more-sites a { font-size:14px; }
.selected-visuals { display:grid; grid-template-columns:1fr 1fr; gap:38px; }
.selected-visual > div { background:#dbe7ef; overflow:hidden; }
.selected-visual img { width:100%; height:300px; object-fit:contain; transition:transform .4s; }
.selected-visual:hover img { transform:scale(1.025); }
.selected-visual p { font-size:10px; color:#57748b; letter-spacing:.1em; margin-top:18px; display:flex; justify-content:space-between; }
.selected-visual h3 { margin-top:6px; font-size:24px; letter-spacing:-.03em; color:#173d5c; }
.selection-all { text-align:center; margin-top:45px; }
.process-section { background:#102f49; }
.process-section h2 { color:#fff; }
.process-section h2 em { color:#7ac9df; }
.process-section .mce-eyebrow { color:#7cabc1; }
.process-section .mce-section-heading > p { color:#adc4d2; }
.process-steps { list-style:none; display:grid; grid-template-columns:repeat(4,1fr); margin:0; padding:0; border-top:1px solid #5d829c; }
.process-steps li { position:relative; padding:26px 24px 0 0; }
.process-steps li::before { content:''; width:7px; height:7px; background:#65d6f0; position:absolute; top:-4px; border-radius:50%; }
.process-steps span { color:#73b8d0; font-size:11px; }
.process-steps h3 { color:#fff; font-size:22px; letter-spacing:-.03em; margin:14px 0 10px; }
.process-steps p { color:#a0bbc9; font-size:13px; line-height:1.7; max-width:210px; }
.official-layout { display:grid; grid-template-columns:1.1fr 1fr; align-items:center; gap:80px; }
.official-preview { display:block; border:1px solid #b6cad8; border-radius:8px; overflow:hidden; box-shadow:0 20px 40px #173d5c12; transform:rotate(-2deg); }
.official-screen { aspect-ratio:1.5; overflow:hidden; }
.official-screen img { width:100%; height:auto; transition:transform 5s ease; }
.official-preview:hover img,.official-preview:focus-visible img { transform:translateY(-12%); }
.official-copy > p:not(.mce-eyebrow) { font-size:15px; line-height:1.8; color:#5d7588; margin:24px 0; }
.mce-final { padding:85px 0; text-align:center; background:#d9ecf5; }
.mce-final h2 { font-size:clamp(30px,4vw,50px); color:#143b5e; line-height:1.15; letter-spacing:-.04em; margin-bottom:30px; }
.realisation-filters { display:flex; flex-wrap:wrap; justify-content:center; gap:6px; background:#fff; padding:10px; border:1px solid #c6d9e5; border-radius:12px; box-shadow:0 10px 30px #0c365418; }
.realisation-filters button { padding:13px 19px; border-radius:8px; color:#486b84; font-size:13px; font-weight:600; }
.realisation-filters button[aria-pressed=true] { color:#fff; background:#173e63; }
.solutions-empty { border:1px solid #c9dae6; padding:40px; background:#f6fafc; border-radius:8px; }
.solutions-empty h2 { font-size:30px; color:#173e63; }
.solutions-empty > p:not(.mce-eyebrow) { max-width:650px; line-height:1.8; margin:18px 0; color:#57758a; }
.project-sheet-details { padding:16px 0 0; margin:16px 0; border-top:1px solid #cbd9e4; }
.project-sheet-details h3 { font-size:11px; text-transform:uppercase; letter-spacing:.1em; color:#547087; margin-bottom:8px; }
.project-sheet-details p { font-size:14px; line-height:1.7; }
.project-visit-inline { font-size:11px; color:#315b76; display:inline-block; margin-top:13px; text-decoration:underline; }
.project-secondary-actions { display:flex; justify-content:space-between; align-items:center; gap:15px; padding-top:8px; }
.project-secondary-actions .project-visit-inline { margin:0; }
.project-details-text { font-size:11px; color:#315b76; padding:8px 0; }
.home-sites-slider .project-secondary-actions { display:none; }
.contact-page { padding:130px 0 90px; background:#eff5fa; }
.contact-heading { border-bottom:1px solid #cbd9e4; padding-bottom:35px; margin-bottom:45px; }
.contact-heading h1 { font-size:clamp(44px,5.5vw,72px); color:#143b5e; line-height:1.02; letter-spacing:-.055em; font-weight:600; }
.contact-heading > p:last-child { margin-top:25px; max-width:490px; font-size:15px; line-height:1.8; color:#547087; }
.contact-layout { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); gap:50px; align-items:start; }
.contact-form { background:#fff; border:1px solid #d3e0e9; border-radius:8px; padding:34px; }
.contact-form h2 { font-size:25px; letter-spacing:-.035em; color:#143b5e; }
.contact-required { font-size:11px; color:#5c7384; margin:12px 0 28px; }
.contact-fields { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.contact-fields label { display:flex; flex-direction:column; gap:9px; color:#31556e; font-size:12px; }
.contact-fields input,.contact-fields select,.contact-fields textarea { min-width:0; width:100%; padding:12px; min-height:46px; border:1px solid #c3d3df; background:#f7fafc; border-radius:5px; color:#143b5e; font-size:14px; }
.contact-fields input::placeholder,.contact-fields textarea::placeholder { color:#758b9b; }
.contact-fields textarea { resize:vertical; }
.contact-message { grid-column:1/-1; }
.contact-delivery { font-size:12px; color:#577184; line-height:1.7; margin:22px 0; }
.contact-status { font-size:13px; line-height:1.7; color:#245d7c; margin-top:16px; }
.contact-aside { padding:28px 0; }
.contact-aside h2 { font-size:29px; line-height:1.2; letter-spacing:-.04em; color:#173e63; }
.contact-aside dl { margin-top:30px; }
.contact-aside dl > div { border-top:1px solid #c9d9e4; padding:18px 0; }
.contact-aside dt { color:#668498; font-size:10px; letter-spacing:.12em; margin-bottom:8px; }
.contact-aside dd { color:#244c69; font-size:15px; line-height:1.7; overflow-wrap:anywhere; }
.contact-whatsapp { display:block; padding:15px; text-align:center; color:#0c5239; background:#d5efdf; border:1px solid #a6cfb8; border-radius:6px; margin-top:20px; font-size:13px; font-weight:600; }
.contact-socials { display:flex; flex-wrap:wrap; gap:18px; font-size:11px; color:#476e88; margin-top:24px; }
@media(max-width:1000px) { .hero-layout { gap:12px; } .hero-copy h1 { font-size:54px; } .hero-composition { height:400px; } .hero-print img { height:165px; } .expertise-grid { grid-template-columns:repeat(3,1fr); } .expertise-card { border-bottom:1px solid var(--mce-line); } .official-layout { gap:40px; } }
@media(max-width:767px) {
 .mce-wrap { width:calc(100% - 36px); } .mce-section { padding:58px 0; }
 .mce-hero { padding-top:108px; } .hero-layout { grid-template-columns:1fr; gap:40px; padding-bottom:45px; }
 .hero-copy h1 { font-size:clamp(42px,10vw,60px); } .hero-lead { font-size:15px; margin:22px 0; }
 .hero-composition { height:360px; max-width:460px; width:100%; margin:auto; } .hero-web { width:80%; } .hero-print img { height:155px; } .hero-brand { bottom:20px; }
 .hero-motion { bottom:-24px; } .hero-bottom { font-size:9px; flex-wrap:wrap; } .hero-signature { margin-top:22px; }
 .mce-actions { gap:10px; } .mce-button { font-size:12px; padding:14px 16px; gap:14px; }
 .mce-section-heading { display:block; margin-bottom:30px; } .mce-section-heading > p { margin-top:20px; font-size:14px; }
 .expertise-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .expertise-card { padding:20px 15px; } .expertise-card h3 { font-size:16px; } .expertise-card:last-child { grid-column:1/-1; border:0; }
 .expertise-card:last-child .expertise-icon { margin-bottom:15px; } .expertise-card:last-child h3 { min-height:0; }
 .selected-visuals { gap:18px; } .selected-visual img { height:180px; } .selected-visual h3 { font-size:18px; } .selected-visual p { font-size:9px; }
 .home-more-sites { margin:22px 0 35px; } .process-steps { grid-template-columns:1fr 1fr; gap:24px 10px; } .process-steps li:nth-child(n+3) { border-top:1px solid #5d829c; }
 .official-layout { grid-template-columns:1fr; gap:35px; } .mce-final { padding:58px 0; }
 .contact-page { padding-top:108px; } .contact-layout { grid-template-columns:1fr; gap:20px; } .contact-form { padding:24px 18px; } .contact-fields { grid-template-columns:1fr; gap:18px; } .contact-heading { margin-bottom:28px; } .contact-aside { padding-top:22px; }
 .realisation-filters { gap:3px; } .realisation-filters button { font-size:11px; padding:12px 10px; } .solutions-empty { padding:25px; }
}
@media(prefers-reduced-motion:reduce) { .hero-composition figure { animation:none; } .hero-motion { display:none; } .official-preview:hover img,.official-preview:focus-visible img { transform:none; } }

/* Page Contact, adaptée à la référence du site officiel. */
.contact-reference { background:#fff; color:#092239; padding:125px 0 85px; }
.contact-reference-wrap { width:min(1504px,calc(100% - 70px)); margin:auto; }
.contact-reference-heading { text-align:center; margin-bottom:50px; }
.contact-reference-heading h1 { font-size:46px; font-weight:800; letter-spacing:-.035em; line-height:1.2; }
.contact-reference-layout { display:grid; grid-template-columns:1fr 2.1fr; gap:50px; align-items:start; }
.contact-info-cards { display:grid; gap:20px; }
.contact-info-card { padding:31px; display:flex; align-items:center; gap:16px; min-height:117px; border:1px solid #edf0f3; border-radius:16px; box-shadow:0 2px 3px #10263806; }
.contact-info-card h2 { color:#092239; font-size:18px; font-weight:700; margin:0 0 3px; }
.contact-info-card p,.contact-info-card a { color:#24435c; font-size:15px; line-height:1.65; overflow-wrap:anywhere; }
.contact-card-icon { flex:none; display:grid; place-items:center; width:54px; height:54px; border-radius:11px; }
.address-icon { color:#0095bf; }
.email-icon { color:#983cff; background:#f5edff; }
.hours-icon { color:#266cff; background:#eaf2ff; }
.phone-card { display:block; }
.phone-card h2 { margin-bottom:12px; }
.phone-card a { display:flex; align-items:center; gap:16px; margin-top:10px; }
.phone-icon { color:#ec8100; }.whatsapp-icon { color:#16c765; }
.contact-reference-form { border:1px solid #edf0f3; border-radius:20px; padding:40px; box-shadow:0 5px 15px #10263808; }
.contact-reference-form h2 { color:#092239; font-size:30px; font-weight:800; letter-spacing:-.025em; }
.contact-form-intro { color:#24435c; font-size:16px; margin:6px 0 36px; }
.contact-reference-form .contact-fields { gap:26px 20px; }
.contact-reference-form label { color:#092239; font-size:14px; font-weight:500; gap:9px; }
.contact-reference-form input,.contact-reference-form textarea { background:white; border:1px solid #dfe4ea; border-radius:8px; min-height:49px; font-size:16px; }
.contact-reference-form textarea { min-height:180px; }
.contact-booking { color:#0094c1; display:inline-flex; gap:10px; align-items:center; font-size:15px; font-weight:600; margin-top:23px; padding:4px 0; }
.contact-booking span { text-decoration:underline; text-underline-offset:4px; }
.contact-reference-form .contact-delivery { margin:18px 0; font-size:11px; color:#677f90; }
.contact-submit-row { display:flex; justify-content:flex-end; }
.contact-send { display:inline-flex; align-items:center; justify-content:center; gap:11px; background:#087da1; color:white; border-radius:7px; min-height:62px; padding:17px 30px; font-weight:700; font-size:17px; transition:background .2s; }
.contact-send svg { color:#082e45; width:21px; }.contact-send:hover { background:#096b8a; }
@media(max-width:1050px) { .contact-reference-layout { grid-template-columns:1fr 1.6fr; gap:25px; } .contact-info-card { padding:22px; } .contact-reference-form { padding:28px; } }
@media(max-width:767px) {
 .contact-reference { padding-top:105px; }.contact-reference-wrap { width:calc(100% - 32px); }
 .contact-reference-heading { margin-bottom:32px; }.contact-reference-heading h1 { font-size:35px; }
 .contact-reference-layout { grid-template-columns:1fr; gap:28px; }.contact-info-cards { gap:14px; }
 .contact-info-card { min-height:102px; padding:23px; }.contact-reference-form { padding:25px 20px; border-radius:15px; }
 .contact-reference-form h2 { font-size:27px; line-height:1.2; }.contact-form-intro { font-size:14px; margin:12px 0 26px; }
 .contact-send { width:100%; padding:16px 10px; font-size:15px; }.contact-reference-form .contact-fields { gap:20px; }
}

/* Typographie commune et accueil bleu lumineux. */
h1,h2,h3,h4,h5,h6 { font-weight:800; }
.mce-section h2,.official-copy h2,.hero-copy h1,.contact-heading h1 { font-weight:900; letter-spacing:-.035em; }
.expertise-card h3 { font-weight:800; }
.mce-hero { background:#b1d9ef url('./assets/hero-blue.png') center / cover no-repeat; color:#062441; }
.mce-hero .mce-eyebrow,.hero-lead,.hero-signature,.hero-motion { color:#284f6c; }
.hero-copy h1 em { color:#007eaa; }
.hero-signature span { background:#007eaa; }
.hero-spark { color:#008cb4; }
.hero-orbit { border-color:#296b9533; }
.hero-bottom { border-color:#244e6c33; color:#284f6c; }
.hero-bottom a { color:#143b5e; }
.mce-hero .mce-button { background:#063452; color:#fff; }
.mce-hero .mce-button:hover { background:#075677; }
.mce-hero .mce-button-outline { background:#ffffff40; border-color:#28557380; color:#123b59; }
.mce-hero .mce-button-outline:hover { background:#ffffff80; }
[data-nav] { background:rgba(221,240,251,.86); border-bottom:1px solid #416b8826; backdrop-filter:blur(18px); }
[data-nav].nav-solid { background:rgba(239,248,253,.97); box-shadow:0 6px 24px #153e5912; }
[data-nav] ul { background:#ffffff55; border-color:#3b6a8a33; }
[data-nav] ul a { color:#103b5d !important; }
[data-nav] ul a:hover { background:#c6e6f5; }
[data-nav] a[href][target='_blank'] { background:#0a3b59; color:white; box-shadow:0 4px 12px #153e591a; }
[data-nav] a[href][target='_blank']:hover { background:#08658a; }
[data-menu-toggle] { color:#103b5d; background:#ffffff66; border-color:#3b6a8a44; }
[data-nav] #mobile-menu { background:#edf7fd; }
[data-nav] a:focus-visible,[data-menu-toggle]:focus-visible,.mce-hero a:focus-visible,.hero-motion:focus-visible { outline:3px solid #007eaa; outline-offset:4px; }



/* Réalisations : aperçu compact de chaque catégorie. */
.category-project-heading { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px; }
.category-more { display:inline-flex; flex-shrink:0; align-items:center; color:#143b5e; font-weight:700; padding:10px 0; text-decoration:underline; text-underline-offset:5px; }
.category-more:hover { color:#007eaa; }
[data-project-section] .category-project-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; max-width:none; padding:0 18px 0 0; margin:0; }
.category-project-grid > .web-project:nth-child(even) { transform:none; }
.category-project-grid > [hidden] { display:none !important; }
.category-project-grid .project-info { padding:24px 18px 20px; }
.category-project-grid .project-open { right:-17px; width:46px; height:46px; top:-23px; }
.category-project-grid .project-stage { padding:30px 22px; }
@media(max-width:1023px) { [data-project-section] .category-project-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:639px) { [data-project-section] .category-project-grid { grid-template-columns:1fr; } }

/* Quinconce : trois cartes, puis deux centrées entre les colonnes. */
@media(min-width:1024px) {
  [data-project-section] .category-project-grid { grid-template-columns:repeat(6,minmax(0,1fr)); row-gap:40px; align-items:start; }
  .category-project-grid > :nth-child(5n + 1) { grid-column:1 / span 2; }
  .category-project-grid > :nth-child(5n + 2) { grid-column:3 / span 2; margin-top:48px; }
  .category-project-grid > :nth-child(5n + 3) { grid-column:5 / span 2; }
  .category-project-grid > :nth-child(5n + 4) { grid-column:2 / span 2; }
  .category-project-grid > :nth-child(5n + 5) { grid-column:4 / span 2; }
}

/* Le lien actif se révèle dans une pastille cyan douce. */
[data-nav] ul a { position:relative; isolation:isolate; transition:color .25s ease,background .25s ease; }
[data-nav] ul a[aria-current='page'] { color:#073a5a !important; background:#c3e9f8; box-shadow:inset 0 0 0 1px #78c8e54d; animation:nav-active-reveal .45s ease-out both; }
[data-nav] ul a[aria-current='page']::after { content:''; position:absolute; bottom:4px; left:calc(50% - 10px); width:20px; height:3px; border-radius:3px; background:#009ccc; transform-origin:center; animation:nav-active-line .45s ease-out both; }
@keyframes nav-active-reveal { from { background:transparent; box-shadow:inset 0 0 0 1px transparent; } to { background:#c3e9f8; box-shadow:inset 0 0 0 1px #78c8e54d; } }
@keyframes nav-active-line { from { transform:scaleX(0); opacity:0; } to { transform:scaleX(1); opacity:1; } }
@media(prefers-reduced-motion:reduce) { [data-nav] ul a[aria-current='page'],[data-nav] ul a[aria-current='page']::after { animation:none; transition:none; } }

/* Titre composé sur trois lignes, sans couper le texte. */
.hero-copy { container-type:inline-size; }
.hero-copy h1 { font-size:clamp(26px,8.7cqi,64px); line-height:1.08; }
.hero-title-line { display:block; white-space:nowrap; }
.mce-text-link,.category-more { position:relative; transition:color .2s ease,transform .2s ease; }
.mce-text-link::after,.category-more::after { content:''; position:absolute; left:0; right:0; bottom:0; height:2px; background:#008eb8; transform:scaleX(0); transform-origin:left; transition:transform .25s ease; }
.mce-text-link:hover,.category-more:hover { color:#007eaa; transform:translateY(-2px); }
.mce-text-link:hover::after,.category-more:hover::after,.mce-text-link:focus-visible::after,.category-more:focus-visible::after { transform:scaleX(1); }
.mce-text-link:active,.category-more:active { transform:translateY(1px) scale(.97); }
.expertise-card { transition:background .25s ease,box-shadow .25s ease; }
.expertise-link,.expertise-link > span { transition:color .2s ease,transform .25s ease; }
.expertise-card:hover .expertise-link,.expertise-card:focus-visible .expertise-link { color:#007eaa; transform:translateX(3px); }
.expertise-card:hover .expertise-link > span,.expertise-card:focus-visible .expertise-link > span { transform:translate(2px,-3px); }
.expertise-card:active { background:#dceff8; box-shadow:inset 0 0 0 1px #78bfd8; }
.expertise-card:active .expertise-link { transform:translateX(3px) scale(.98); }
@media(prefers-reduced-motion:reduce) { .mce-text-link,.category-more,.mce-text-link::after,.category-more::after,.expertise-card,.expertise-link,.expertise-link > span { transition:none; } }

/* Retour d'interaction plus affirmé pour les liens et appels à l'action. */
.mce-text-link,.category-more { padding:11px 17px; border:1px solid #7cb7d1; border-radius:7px; text-decoration:none; transition:background .18s ease,color .18s ease,box-shadow .18s ease,transform .18s ease; }
.mce-text-link::after,.category-more::after { display:none; }
.mce-text-link:hover,.category-more:hover,.mce-text-link:focus-visible,.category-more:focus-visible { background:#0a577b; color:white; border-color:#0a577b; box-shadow:0 7px 16px #0a577b30; transform:translateY(-4px); }
.mce-text-link:active,.category-more:active { background:#062f4b; color:white; box-shadow:inset 0 3px 7px #001e3b55; transform:translateY(1px) scale(.94); transition-duration:.07s; }
.expertise-link { padding:10px 12px; margin-inline:-12px; border-radius:6px; transition:background .18s ease,color .18s ease,box-shadow .18s ease,transform .18s ease; }
.expertise-card:hover,.expertise-card:focus-visible { background:#e0f2fa; box-shadow:inset 0 0 0 2px #72bddb; }
.expertise-card:hover .expertise-link,.expertise-card:focus-visible .expertise-link { background:#0a577b; color:white; transform:translateY(-3px); box-shadow:0 5px 12px #0a577b25; }
.expertise-card:hover .expertise-link > span,.expertise-card:focus-visible .expertise-link > span { transform:translate(4px,-4px) scale(1.25); }
.expertise-card:active .expertise-link { background:#062f4b; color:white; transform:translateY(1px) scale(.94); box-shadow:inset 0 3px 7px #001e3b55; transition-duration:.07s; }
.mce-button { transition:background .18s ease,box-shadow .18s ease,transform .18s ease; }
.mce-button:hover { transform:translateY(-4px); box-shadow:0 8px 18px #073b5933; }
.mce-button:active { transform:translateY(1px) scale(.95); box-shadow:inset 0 3px 7px #001e3b44; transition-duration:.07s; }
@media(prefers-reduced-motion:reduce) { .mce-text-link,.category-more,.expertise-link,.mce-button { transition:none; } }


.gallery-back { display:inline-flex; align-items:center; gap:9px; margin-bottom:32px; }
.gallery-back svg { transition:transform .2s ease; }
.gallery-back:hover svg { transform:translateX(-4px); }
.gallery-back:active svg { transform:translateX(-6px); }



/* Galeries complètes : trois colonnes, seule celle du milieu est décalée. */
@media(min-width:1024px) {
  .category-gallery .full-gallery-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:72px 40px; align-items:start; max-width:none; padding:0 24px 80px 0; }
  .category-gallery .full-gallery-grid > :nth-child(n) { transform:none; margin-top:0; }
  .category-gallery .full-gallery-grid > :nth-child(3n + 2) { margin-top:64px; }
}

/* Petits écrans : les étapes restent dans leur colonne sans élargir la page. */
@media(max-width:767px) {
  .process-steps { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .process-steps li { min-width:0; }
  .process-steps h3 { font-size:clamp(16px,4.5vw,22px); overflow-wrap:anywhere; }
  .project-type,.project-client { overflow-wrap:anywhere; }
  [data-menu-toggle] { min-width:44px; min-height:44px; }
  .project-switch button { min-height:44px; }
}

/* Logos clients : visuels entiers sur un support blanc. */
.logo-card { background:#fff; border:1px solid #d1e1eb; border-radius:12px; overflow:hidden; cursor:pointer; box-shadow:0 5px 18px #143b5e0a; transition:box-shadow .2s ease; }
.logo-stage { aspect-ratio:1; display:flex; align-items:center; justify-content:center; background:#fff; padding:16px; overflow:hidden; }
.logo-stage img { display:block; width:100%; height:100%; object-fit:contain; background:#fff; transition:transform .3s ease; }
.logo-caption { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:18px; border-top:1px solid #edf2f5; color:#143b5e; }
.logo-caption h3 { font-size:17px; font-weight:800; overflow-wrap:anywhere; }
.logo-card:hover { box-shadow:0 10px 28px #143b5e22; }
.logo-card:hover img { transform:scale(1.04); }
.hero-brand { background:#fff !important; }
.hero-brand img { object-fit:contain; background:#fff; }
.selected-logo > div { background:#fff; }
.selected-logo img { object-fit:contain; background:#fff; }
.lightbox { background:#fff; }
.lightbox img { background:#fff; object-fit:contain; }
@media(max-width:639px) { .category-gallery .full-gallery-grid:has(.logo-card) { grid-template-columns:1fr; } }
@media(prefers-reduced-motion:reduce) { .logo-card,.logo-stage img { transition:none; } }

/* Galerie logos : quatre colonnes alternées, sans modifier les images. */
@media(min-width:1024px) {
  .category-gallery .full-gallery-grid:has(> .logo-card) { grid-template-columns:repeat(4,minmax(0,1fr)); gap:40px 24px; }
  .category-gallery .full-gallery-grid > .logo-card:nth-child(n) { margin-top:0; transform:none; }
  .category-gallery .full-gallery-grid > .logo-card:nth-child(even) { margin-top:56px; }
}

/* Galeries de l'accueil : défilement interne sur ordinateur. */
.portfolio-heading { text-align:center; margin-bottom:64px; }
.home-category { margin-bottom:64px; min-width:0; }
.home-category > header { display:flex; align-items:baseline; justify-content:space-between; gap:20px; margin-bottom:24px; }
.home-category > header h3 { font-size:clamp(23px,3vw,34px); color:#143b5e; }
.home-category > header span { color:#547087; font-size:13px; }
.home-category-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; align-items:start; }
.home-category-grid > :nth-child(n) { margin:0; transform:none; min-width:0; }
.home-category-grid > :nth-child(n+3) { display:none; }
.category-footer { display:flex; justify-content:center; margin-top:24px; }
.desktop-gallery-toggle { display:none; }
.print-stage { background:#fff; }
.print-card { background:white; border:1px solid #d1e1eb; border-radius:12px; overflow:hidden; cursor:pointer; }
.print-card h3 { padding:18px; color:#143b5e; }
.print-stage img,.home-category[data-home-category="flyers"] img,.category-gallery .full-gallery-grid [data-preview]:not(.logo-card) img { width:100%; height:390px; object-fit:contain; background:#fff; }
.project-info .project-open { position:static; display:inline-flex; width:auto; height:auto; gap:12px; padding:10px 14px; margin-bottom:18px; border-radius:6px; font-size:13px; font-weight:700; }
.project-open svg { transition:transform .2s ease; }
.project-info .project-open:hover { transform:translateY(-2px); }
.project-open:hover svg { transform:translateX(4px); }
.project-info .project-open:active { transform:translateY(1px) scale(.97); }
.home-category-window:focus-visible { outline:3px solid #008eb8; outline-offset:5px; }
#portfolio { scroll-margin-top:100px; }
@media(min-width:768px) {
 .mobile-realisation-cta,.mobile-gallery-link { display:none; }
 .desktop-gallery-toggle { display:inline-flex; gap:12px; align-items:center; }
 .home-category-window { height:620px; overflow:hidden; }
 .home-category.is-expanded .home-category-window { overflow-y:auto; overscroll-behavior-y:contain; scrollbar-gutter:stable; padding-right:14px; }
 .home-category.is-expanded .home-category-grid > :nth-child(n) { display:block; }
 .home-category[data-home-category="logos"] .home-category-window,.home-category[data-home-category="flyers"] .home-category-window,.home-category[data-home-category="videos"] .home-category-window { height:520px; }
 .home-category .logo-stage { height:390px; aspect-ratio:auto; }
}
@media(max-width:767px) {
 .home-category-grid { grid-template-columns:1fr; gap:24px; }
 .portfolio-heading { margin-bottom:36px; }
 .home-category { margin-bottom:46px; }
}
@media(prefers-reduced-motion:reduce) { .project-open,.project-open svg { transition:none; } }
@media(min-width:768px) {
 .home-category .home-category-window { height:auto; }
 .home-category.is-expanded .home-category-window { height:var(--gallery-height); min-height:300px; }
}

/* Échelle plus fine : titres modérés, cartes compactes et mouvements discrets. */
h1,h2,h3,h4,h5,h6 { font-weight:600; }
.mce-wrap { width:min(1080px,calc(100% - 64px)); }
.mce-section { padding:72px 0; }
.mce-section h2,.official-copy h2,.contact-heading h1 { font-size:clamp(28px,3vw,38px); font-weight:600; letter-spacing:-.025em; line-height:1.2; }
.hero-copy h1 { font-size:clamp(28px,7.6cqi,46px); font-weight:600; letter-spacing:-.03em; line-height:1.12; }
.mce-hero { padding-top:112px; }
.hero-layout { min-height:520px; padding-bottom:42px; gap:40px; }
.hero-lead { font-size:15px; line-height:1.75; max-width:370px; margin:20px 0; }
.hero-composition { height:390px; }
.hero-composition figure { box-shadow:0 12px 30px #00172b2b; }
.hero-print img { height:175px; }
.mce-section-heading { margin-bottom:36px; }
.portfolio-heading { margin-bottom:44px; }
.home-category { margin-bottom:48px; }
.home-category > header { margin-bottom:20px; }
.home-category > header h3 { font-size:clamp(21px,2.3vw,27px); font-weight:600; letter-spacing:-.02em; }
.home-category-grid { gap:26px; }
.project-stage { aspect-ratio:1.55; padding:28px 26px 24px; }
.project-info { padding:20px; }
.project-info h3.project-client { font-size:clamp(19px,1.7vw,23px); font-weight:600; margin:0 0 10px; }
.project-controls { margin-top:18px; padding-top:14px; }
.project-info .project-open { font-size:12px; font-weight:500; padding:8px 12px; margin-bottom:14px; }
.logo-caption { padding:15px 18px; }
.logo-caption h3,.print-card h3 { font-size:15px; font-weight:600; }
.logo-card,.print-card { border-radius:8px; box-shadow:none; }
.logo-card:hover { box-shadow:0 5px 14px #143b5e12; }
.mce-button,.mce-text-link,.category-more { min-height:44px; padding:10px 17px; font-size:13px; font-weight:500; border-radius:5px; }
.mce-button:hover,.mce-text-link:hover,.category-more:hover { transform:translateY(-2px); box-shadow:0 3px 9px #073b5918; }
.mce-button:active,.mce-text-link:active,.category-more:active { transform:translateY(1px) scale(.98); box-shadow:none; }
.process-steps h3 { font-size:19px; font-weight:600; }
.mce-final { padding:64px 0; }
.mce-final h2 { font-size:clamp(27px,3.2vw,39px); font-weight:600; margin-bottom:24px; }
[data-nav] ul a { font-weight:500; font-size:13px; }
[data-nav] a[href][target='_blank'] { font-size:12px; font-weight:500; padding:11px 17px; box-shadow:none; }
.contact-reference-heading h1 { font-size:38px; font-weight:600; }
.contact-reference-form h2 { font-size:26px; font-weight:600; }
.contact-reference-form { border-radius:12px; padding:30px; box-shadow:none; }
.contact-info-card { border-radius:10px; padding:24px; }
.contact-info-card h2 { font-size:16px; font-weight:600; }
.contact-send { font-size:15px; min-height:48px; padding:12px 22px; font-weight:500; }
@media(min-width:768px) {
 .home-category .logo-stage { height:310px; }
 .home-category[data-home-category="flyers"] img { height:330px; }
}
@media(max-width:767px) {
 .mce-wrap { width:calc(100% - 36px); }
 .mce-section { padding:48px 0; }
 .mce-hero { padding-top:100px; }
 .hero-layout { min-height:0; gap:28px; padding-bottom:34px; }
 .hero-copy h1 { font-size:clamp(27px,8cqi,40px); }
 .hero-composition { height:310px; max-width:400px; }
 .hero-print img { height:140px; }
 .hero-lead { font-size:14px; }
 .home-category-grid { gap:22px; }
 .home-category { margin-bottom:38px; }
 .portfolio-heading { margin-bottom:32px; }
 .project-info { padding:18px; }
 .project-stage { padding:24px 22px; }
 .mce-final { padding:48px 0; }
 .contact-reference-heading h1 { font-size:30px; }
 .contact-reference-form { padding:24px 20px; }
 .contact-reference-form h2 { font-size:23px; }
}

.contact-submit-row { margin-top:24px; gap:16px; flex-wrap:wrap; align-items:center; justify-content:space-between; }
.contact-whatsapp-direct { display:inline-flex; align-items:center; justify-content:center; gap:9px; min-height:46px; padding:10px 14px; border:1px solid #b5d8c5; border-radius:6px; color:#157347; background:#f1faf5; font-size:13px; font-weight:500; transition:background .2s,transform .2s; }
.contact-whatsapp-direct:hover { background:#dff3e7; transform:translateY(-1px); }
.contact-whatsapp-direct:active { transform:translateY(1px); }
.contact-whatsapp-direct:focus-visible { outline:2px solid #157347; outline-offset:3px; }
@media(max-width:767px) { .contact-whatsapp-direct { width:100%; } }
@media(prefers-reduced-motion:reduce) { .contact-whatsapp-direct { transition:none; } }

/* Quatre réalisations par ligne sur ordinateur. */
@media(min-width:1024px) {
 .home-category-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; }
 .home-category-grid > :nth-child(-n+4) { display:block; }
 .home-category-grid > :nth-child(n+5) { display:none; }
 .home-category.is-expanded .home-category-grid > :nth-child(n) { display:block; }
 .home-category .home-category-window { height:auto; }
 .home-category.is-expanded .home-category-window { height:var(--gallery-height); min-height:300px; }
 .home-category .project-stage { padding:22px 16px; }
 .home-category .project-info { padding:16px 12px; }
 .home-category .project-info h3.project-client { font-size:18px; }
 .home-category .project-switch button { padding:8px; font-size:11px; }
 .home-category .logo-stage { height:220px; padding:12px; }
 .home-category[data-home-category="flyers"] img { height:260px; }
 .home-category .logo-caption { padding:14px 12px; }
}

/* La galerie repliée épouse ses cartes, sans hauteur vide avant le bouton. */
#portfolio .home-category:not(.is-expanded) .home-category-window { height:auto; min-height:0; }
#portfolio .category-footer { margin-top:16px; }
