/* B affinée — scoped home composition and shared dark brand frame. */
:root{--b-night:#03182b;--b-deep:#06345d;--b-white:#f7f9fc;--b-soft:#cad8e8;--b-surface:#eef7fd;--b-accent:#0096ee;--b-radius:14px;--b-gradient:linear-gradient(90deg,var(--b-night),var(--b-deep));}
.b-shell{width:min(calc(100% - 80px),1320px);margin-inline:auto;box-sizing:border-box;}
.o-header,.o-footer{background:var(--b-gradient);color:var(--b-white);border:0;}
.o-header .o-shell,.o-footer .o-shell{width:min(calc(100% - 80px),1320px);}
.o-header-row{padding-block:18px;gap:36px;justify-content:flex-start;}
.o-header .custom-logo{width:180px;}
.o-header .wp-block-navigation{color:var(--b-white);font-size:1rem;margin-left:auto;}
.o-header .wp-block-navigation__container{gap:30px;}
.o-header .current-menu-item>.wp-block-navigation-item__content{color:var(--b-white);}
.o-header .wp-block-navigation__responsive-container.is-menu-open{background:var(--b-night);color:var(--b-white);}
body:not(.wp-admin) .o-header a:focus-visible,body:not(.wp-admin) .o-header button:focus-visible,body:not(.wp-admin) .o-footer a:focus-visible,body:not(.wp-admin) .b-hero a:focus-visible{outline-color:var(--b-white);box-shadow:0 0 0 3px var(--b-night);}
.o-footer{padding-block:30px;}
.o-footer-row{align-items:center;gap:36px;}
.o-footer-brand{display:flex;align-items:center;gap:24px;max-width:440px;}
.o-footer-brand .custom-logo{width:160px;height:auto;display:block;}
.o-footer-brand .wp-block-site-logo{flex-shrink:0;}
.o-footer-brand p{color:var(--b-soft);font-size:.875rem;margin:0;padding-left:24px;border-left:1px solid #72899e;}
.o-footer-links{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 24px;max-width:660px;}
/* Reset every item, including the first, against WordPress list spacing. */
.o-footer-links.wp-block-list>li{margin:0;}
.o-footer-links a{color:var(--b-white);font-size:.875rem;min-height:44px;box-sizing:border-box;display:flex;align-items:center;}
.b-home{background:var(--b-surface);color:var(--b-night);}
.b-home.wp-block-group>*{margin-block-start:0;}
.b-home h1,.b-home h2,.b-home h3{color:inherit;}
.b-home p{line-height:1.45;}
.b-hero{background-color:var(--b-night);background-image:linear-gradient(90deg,rgba(3,24,43,.92),rgba(6,52,93,.82)),url('../../../../uploads/2026/10/99outils-armoire-industrielle-cablage-fond-accueil.webp');background-size:cover;background-position:center;background-repeat:no-repeat;color:var(--b-white);padding:6px 0 48px;}
.b-hero-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:40px;align-items:center;}
.b-hero-grid.wp-block-group>*{min-width:0;margin:0;}
.b-kicker{font-size:.8125rem;letter-spacing:.16em;line-height:1.4;text-transform:uppercase;margin:0 0 20px;color:var(--b-soft);}
.b-hero-copy>.b-kicker{margin-block:0 var(--o-5);}
.b-hero h1{font-size:clamp(2.7rem,4.3vw,4rem);font-weight:700;line-height:1.02;letter-spacing:-.035em;margin:0;max-width:none;}
.b-hero-copy>p:not(.b-kicker){font-size:1.25rem;line-height:1.45;margin:18px 0 0;max-width:40ch;}
.b-hero .wp-block-buttons{margin-top:26px;}
.b-hero .wp-block-button__link{background:var(--b-accent);color:var(--b-night);font-size:1.125rem;font-weight:700;padding:16px 24px;border:1px solid #63c4ff;border-radius:12px;text-decoration:none;}
.b-hero .wp-block-button__link::after{content:' →';padding-left:12px;}
.b-hero .wp-block-button__link:hover{background:#5bc0fa;}
.b-repers{display:flex;gap:20px;margin-top:42px;align-items:center;}
.b-repers p{margin:0;font-size:.9375rem;line-height:1.3;display:flex;align-items:center;gap:12px;max-width:150px;}
.b-repers p+p{padding-left:20px;border-left:1px solid #72899e;}
.b-repers p::before{content:'';width:28px;height:32px;flex:0 0 28px;background:currentColor;mask:var(--b-icon) center/contain no-repeat;}
/* A single arrival sequence, under five seconds; text and layout stay still. */
@media(prefers-reduced-motion:no-preference){
 .b-home .b-repers .b-book::before{animation:b-book-arrival 1.2s ease-in-out .3s 1;}
 .b-home .b-repers .b-gear::before{animation:b-gear-arrival 1.25s ease-in-out 1.6s 1;}
 .b-home .b-repers .b-bulb::before{animation:b-bulb-arrival 1.4s ease-in-out 2.95s 1;}
}
@keyframes b-book-arrival{0%,100%{transform:rotate(0);}25%{transform:rotate(-12deg);}55%{transform:rotate(9deg);}80%{transform:rotate(-4deg);}}
@keyframes b-gear-arrival{from{transform:rotate(0);}to{transform:rotate(360deg);}}
@keyframes b-bulb-arrival{0%,100%{background:currentColor;filter:drop-shadow(0 0 0 transparent);}35%,65%{background:#63c4ff;filter:drop-shadow(0 0 5px #63c4ff);}}
.b-book{--b-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='none' stroke='black' stroke-width='2' d='M16 7C12 3 5 3 2 5v23c5-3 10-3 14 0 4-3 9-3 14 0V5c-3-2-10-2-14 2v21'/%3E%3C/svg%3E");}
.b-gear{--b-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cg fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='m13 2 6 0 1 5 4 2 4-1 3 6-4 3-1 4 2 4-5 4-4-3h-5l-4 3-5-4 2-4-1-4-4-3 3-6 4 1 4-2z'/%3E%3Ccircle cx='16' cy='16' r='5'/%3E%3C/g%3E%3C/svg%3E");}
.b-bulb{--b-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='none' stroke='black' stroke-width='2' d='M11 25v-4C0 10 9 2 16 2s16 8 5 19v4H11zm0 4h10'/%3E%3C/svg%3E");}
.b-hero-media{position:relative;margin:0 0 4px;}
.b-home .b-hero-media{z-index:1;transform:translateY(80px);}
.b-home .b-welcome{padding-top:96px;}
@media(max-width:599px){.b-home .b-hero-media{transform:translateY(48px);}.b-home .b-welcome{padding-top:64px;}}
.b-hero-media figure{margin:0;}
.b-hero-main img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:var(--b-radius);border:1px solid #3598d5;box-sizing:border-box;}
.b-hero-inset{position:absolute;right:-16px;bottom:-26px;width:26%;max-width:164px;}
.b-hero-inset img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;object-position:68% center;border:1px solid #89c7ef;border-radius:var(--b-radius);box-shadow:0 8px 20px #001a3040;box-sizing:border-box;}
/* Center the current relay photograph and keep the complete device in view. */
.b-home .b-hero-inset{aspect-ratio:1;overflow:hidden;border:1px solid #89c7ef;border-radius:var(--b-radius);box-shadow:0 8px 20px #001a3040;box-sizing:border-box;}
.b-home .b-hero-inset img{height:100%;object-position:center;transform:none;transform-origin:center;filter:brightness(1.35) saturate(1.04);border:0;border-radius:0;box-shadow:none;}
.b-welcome{padding:26px 0 24px;}
.b-welcome h2{font-size:1.375rem;line-height:1.25;margin:0 0 6px;font-weight:600;}
.b-welcome p{font-size:1.0625rem;color:#34516b;margin:0;max-width:100ch;}
.b-univers{padding:8px 0 0;scroll-margin-top:24px;}
.b-home .b-section-title{font-size:clamp(1.875rem,3vw,2.5rem);font-weight:700;line-height:1.1;letter-spacing:-.025em;margin:0 0 20px;}
.b-universe-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;}
.b-universe-grid.wp-block-group>*{margin:0;min-width:0;}
.wp-block-outils99-navigation-card.is-illustrated{display:grid;grid-template-columns:minmax(0,1fr) auto;align-content:start;gap:8px 6px;padding:10px 10px 14px;border:1px solid #ffffff; border-radius:var(--b-radius);box-shadow:0 4px 18px #06345d05;color:var(--b-night);}
.wp-block-outils99-navigation-card.is-illustrated>img{grid-column:1/-1;width:100%;height:auto;aspect-ratio:5/4;object-fit:cover;border-radius:9px;display:block;margin-bottom:2px;}
.wp-block-outils99-navigation-card.is-illustrated h3{font-size:1.375rem;line-height:1.12;font-weight:700;letter-spacing:-.025em;grid-column:1;grid-row:2;margin:0;}
.wp-block-outils99-navigation-card.is-illustrated p{font-size:.875rem;line-height:1.4;color:#34516b;grid-column:1/-1;grid-row:3;margin:0;}
.wp-block-outils99-navigation-card.is-illustrated .o-card-action{grid-column:2;grid-row:2;padding:0;margin:0;align-self:center;font-size:1.4rem;line-height:1;color:var(--b-deep);}
a.wp-block-outils99-navigation-card.is-illustrated:hover{border-color:var(--o-blue);box-shadow:0 4px 14px #06345d12;}
.b-editorial{padding:32px 0 28px;}
.b-editorial>.b-kicker{color:var(--o-blue);margin:0 0 6px;}
.b-editorial-grid{display:grid;grid-template-columns:1.65fr 1.05fr .75fr;gap:14px;align-items:stretch;}
.b-editorial-grid.wp-block-group>*{margin:0;min-width:0;}
.b-video-card{position:relative;min-height:310px;border-radius:var(--b-radius);overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;color:var(--b-white);padding:22px;box-sizing:border-box;isolation:isolate;}
.b-video-card>figure{position:absolute;inset:0;margin:0;z-index:-2;}
.b-video-card>figure img{width:100%;height:100%;object-fit:cover;display:block;}
/* Keep the relay prominent in the taller mobile card without changing other photos. */
@media(max-width:599px){.b-video-card>.b-relay-photo img{object-position:75% 50%;transform:scale(1.12);transform-origin:75% 50%;}}
.b-video-card::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#001322ed 0%,#00132230 55%,transparent 100%);}
.b-video-card h3{font-size:1.65rem;line-height:1.15;margin:12px 0 6px;font-weight:700;max-width:27ch;}
.b-video-card p{font-size:1rem;line-height:1.4;margin:0;}
.b-status{display:inline-flex;align-self:flex-start;gap:8px;border:1px solid #8cafca;border-radius:10px;padding:7px 12px;color:var(--b-white);font-size:.9375rem;line-height:1.25;background:#06345d66;width:fit-content;}
.b-video-card .b-status{font-size:.8125rem;padding:5px 9px;background:#03182bbf;}
.b-secondary{display:grid;gap:12px;}
.b-secondary.wp-block-group>*{margin:0;min-width:0;}
.wp-block-outils99-navigation-card.is-feature{position:relative;isolation:isolate;min-height:148px;padding:20px 40% 20px 18px;display:flex;justify-content:center;gap:8px;overflow:hidden;}
.wp-block-outils99-navigation-card.is-feature>img{position:absolute;inset:0 0 0 auto;width:65%;height:100%;object-fit:cover;z-index:-2;border-radius:0;margin:0;}
.wp-block-outils99-navigation-card.is-feature::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#fff 0%,#fff 37%,#ffffffdd 49%,transparent 80%);}
.wp-block-outils99-navigation-card.is-feature h3{font-size:1.25rem;line-height:1.15;}
.wp-block-outils99-navigation-card.is-feature p{font-size:.875rem;}
.wp-block-outils99-navigation-card.is-feature .o-card-action{position:absolute;right:12px;bottom:12px;background:white;border-radius:50%;width:38px;height:38px;display:grid;place-content:center;box-shadow:0 2px 8px #03182b20;}
.b-module{background:var(--b-gradient);border:1px solid #06345d;border-radius:var(--b-radius);padding:22px 18px;display:flex;flex-direction:column;align-items:flex-start;color:var(--b-white);}
.b-module .b-kicker{font-size:.6875rem;letter-spacing:.035em;color:var(--b-white);margin:0 0 24px;}
.b-module h3{font-size:1.55rem;font-weight:700;line-height:1.15;margin:0 0 8px;}
.b-module h3::before{content:'';display:block;width:42px;height:50px;margin:0 auto 18px;background:#9fc4e4;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 48'%3E%3Cpath fill='none' stroke='black' stroke-width='2' d='M4 2h23l9 9v35H4zM27 2v10h9M11 20h18M11 27h18M11 34h12'/%3E%3C/svg%3E") center/contain no-repeat;}
.b-module>p:not(.b-kicker):not(.b-status){font-size:1rem;line-height:1.35;margin:0 0 16px;}
.b-module .b-status{margin:auto 0 0;}
.b-module .b-status::before{content:'◷';font-size:1.15rem;}
.editor-styles-wrapper .o-card-image-editor{grid-column:1/-1;position:relative;}
.editor-styles-wrapper .o-card-image-editor img{display:block;width:100%;height:auto;aspect-ratio:5/4;object-fit:cover;border-radius:9px;}
.editor-styles-wrapper .o-card-image-editor button{position:absolute;bottom:8px;left:8px;background:white;color:var(--b-night);}
.editor-styles-wrapper .is-feature .o-card-image-editor{position:relative;inset:auto;width:100%;}
@media(max-width:1100px){.o-header .wp-block-navigation__container{gap:20px;}.b-repers{gap:12px;}.b-repers p{font-size:.875rem;gap:8px;}.b-repers p+p{padding-left:12px;}.b-hero-grid{gap:28px;}.b-editorial-grid{grid-template-columns:1.6fr 1fr .8fr;}.b-module{padding:20px 16px;}.b-module h3{font-size:1.4rem;}}
@media(max-width:959px){.b-shell,.o-header .o-shell,.o-footer .o-shell{width:calc(100% - 48px);}.b-hero-grid{grid-template-columns:1fr;gap:30px;}.b-hero-copy{max-width:650px;}.b-hero h1{font-size:3.5rem;max-width:16ch;}.b-hero-media{max-width:700px;width:100%;}.b-repers{margin-top:28px;}.b-universe-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;}.b-editorial-grid{grid-template-columns:1.4fr 1fr;}.b-module{grid-column:1/-1;display:grid;grid-template-columns:1fr 1.5fr auto;gap:8px 20px;align-items:center;}.b-module .b-kicker{grid-column:1/-1;margin:0;}.b-module h3{margin:0;}.b-module h3::before{display:none;}.b-module>p:not(.b-kicker):not(.b-status){margin:0;}.b-module .b-status{margin:0;}.o-footer-brand{max-width:100%;}}
@media(max-width:599px){.b-shell,.o-header .o-shell,.o-footer .o-shell{width:calc(100% - 32px);}.o-header-row{padding-block:14px;gap:16px;}.o-header .custom-logo{width:140px;}.o-footer-brand .custom-logo{width:125px;}.b-hero{padding:10px 0 34px;}.b-hero h1{font-size:2.65rem;max-width:13ch;}.b-kicker{font-size:.6875rem;letter-spacing:.13em;margin-bottom:16px;}.b-hero-copy>.b-kicker{margin-bottom:var(--o-4);}.b-hero-copy>p:not(.b-kicker){font-size:1.125rem;margin-top:16px;}.b-hero .wp-block-buttons{margin-top:22px;}.b-hero .wp-block-button__link{font-size:1rem;padding:14px 18px;}.b-repers{gap:10px;margin-top:26px;align-items:flex-start;}.b-repers p{font-size:.8125rem;display:block;flex:1;}.b-repers p::before{display:block;margin-bottom:8px;width:24px;height:26px;}.b-repers p+p{padding-left:10px;}.b-hero-grid{gap:26px;}.b-hero-inset{display:none;}.b-welcome{padding:22px 0;}.b-welcome h2{font-size:1.25rem;}.b-welcome p{font-size:1rem;}.b-home .b-section-title{font-size:1.875rem;line-height:1.13;margin-bottom:16px;}.b-universe-grid{grid-template-columns:minmax(0,1fr);gap:14px;}.b-universe-grid>.is-illustrated>img{aspect-ratio:2/1;}.b-universe-grid .o-card-image-editor img{aspect-ratio:2/1;}.wp-block-outils99-navigation-card.is-illustrated h3{font-size:1.5rem;}.wp-block-outils99-navigation-card.is-illustrated p{font-size:.9375rem;}.b-editorial{padding-top:28px;}.b-editorial-grid{grid-template-columns:minmax(0,1fr);gap:14px;}.b-video-card{min-height:300px;padding:20px;}.b-video-card h3{font-size:1.65rem;}.b-secondary{gap:14px;}.wp-block-outils99-navigation-card.is-feature{min-height:156px;padding-right:40%;}.wp-block-outils99-navigation-card.is-feature h3{font-size:1.35rem;}.b-module{display:flex;gap:0;padding:22px;}.b-module .b-kicker{margin-bottom:14px;}.b-module h3{font-size:1.5rem;margin-bottom:8px;}.b-module>p:not(.b-kicker):not(.b-status){margin-bottom:16px;}.o-footer-row{gap:24px;}.o-footer-brand{flex-wrap:wrap;gap:16px;}.o-footer-brand p{border:0;padding:0;max-width:30ch;}.o-footer-links{gap:0 24px;}.o-footer-links a{font-size:.9375rem;}}
@media(prefers-reduced-motion:reduce){.b-home *{animation:none;transition:none;scroll-behavior:auto;}}
@media(forced-colors:active){.b-video-card::before,.is-feature::before{background:Canvas;}.b-home .b-status{border-color:CanvasText;}.b-home img{forced-color-adjust:none;}}

.b-home .b-universe-grid,.b-home .b-editorial-grid{margin-block-start:0;}

/* Fixed photo frames keep the zoom inside the image, away from text and focus outlines. */
.b-home .b-hero-main{aspect-ratio:4/3;overflow:hidden;border:1px solid #3598d5;border-radius:var(--b-radius);box-sizing:border-box;}
.b-home .b-hero-main img{height:100%;border:0;border-radius:0;}
.b-home .b-card-photo{grid-column:1/-1;display:block;aspect-ratio:5/4;overflow:hidden;border-radius:9px;margin-bottom:2px;}
.b-home .b-card-photo>img{display:block;width:100%;height:100%;object-fit:cover;}
/* Preserve the real photograph; frame the drives and wiring above the grey floor. */
.b-home .b-card-photo>img[src*="99outils-variateurs-armoire-industrielle"]{object-position:65% 0;transform:scale(1.3);transform-origin:65% 0;}
@media(max-width:599px){.b-home .b-card-photo>img[src*="99outils-variateurs-armoire-industrielle"]{transform:none;}}
@media(max-width:599px){.b-home .b-card-photo{aspect-ratio:2/1;}}
.b-home :is(.b-hero-inset,.b-video-card){--b-photo-hover-scale:1.035;}
@media(prefers-reduced-motion:no-preference){
 .b-home :is(.b-hero-main,.b-hero-inset,.b-card-photo,.b-video-card>.b-photo,.wp-block-outils99-navigation-card.is-feature)>img{
  transition:scale .6s cubic-bezier(.2,.65,.3,1);
 }
 @media(hover:hover) and (pointer:fine){
  .b-home :is(.b-hero-main,.b-hero-inset):hover>img,
  .b-home .b-video-card:hover>.b-photo>img,
  .b-home .wp-block-outils99-navigation-card:hover>.b-card-photo>img,
  .b-home .wp-block-outils99-navigation-card.is-feature:hover>img{
   scale:var(--b-photo-hover-scale,1.06);
  }
 }
 .b-home .wp-block-outils99-navigation-card:focus-visible>.b-card-photo>img,
 .b-home .wp-block-outils99-navigation-card.is-feature:focus-visible>img,
 .b-home .b-video-card:has(a:focus-visible)>.b-photo>img{
  scale:var(--b-photo-hover-scale,1.06);
 }
}

/* Mission 5.1: an in-flow footer on both short and long pages. */
body:not(.wp-admin) .wp-site-blocks {
 display:flex;
 flex-direction:column;
 min-height:100vh;
 min-height:100dvh;
}
body.admin-bar:not(.wp-admin) .wp-site-blocks {
 min-height:calc(100vh - var(--wp-admin--admin-bar--height,32px));
 min-height:calc(100dvh - var(--wp-admin--admin-bar--height,32px));
}
.wp-site-blocks > header,.wp-site-blocks > footer { flex:0 0 auto; }
.wp-site-blocks > .o-main { flex:1 0 auto; display:flex; flex-direction:column; }
.o-main > .wp-block-post-content { flex:1 0 auto; display:flex; flex-direction:column; }
.o-main .b-home { flex:1 0 auto; display:flex; flex-direction:column; }
/* The growing home wrapper keeps spare viewport space after the editorial
   content. Section spacing stays intrinsic; the footer remains in flow. */
.o-header .custom-logo-link,.o-footer .custom-logo-link {
 display:flex;
 align-items:center;
 min-height:48px;
}
@media(min-width:960px) {
 .b-hero-grid { align-items:stretch; }
 .b-hero-copy { display:flex; flex-direction:column; padding-top:var(--o-6); }
 .b-hero-copy > .b-repers { margin-top:auto; padding-top:var(--o-6); }
 .b-hero-media { align-self:end; }
 .b-universe-grid { row-gap:8px; }
 .b-universe-grid > .is-illustrated {
  grid-row:span 3;
  grid-template-rows:subgrid;
 }
 /* Reuse the available width while the unfinished module is withheld. */
 .b-editorial-grid:not(:has(> .b-module)) { grid-template-columns:1.65fr 1.05fr; }
}

/* BEGIN LOGO TRIAL 20261023 */
/* Only this new media is affected; selecting the previous logo keeps its original sizing. */
.o-header .custom-logo[src*="99outils-logo-contour-blanc"] {
  width:190px;
  height:auto;
  margin-block:-10.2px;
}
.o-footer .custom-logo[src*="99outils-logo-contour-blanc"] {
  width:175px;
  height:auto;
}
@media (max-width:599px) {
  .o-header .custom-logo[src*="99outils-logo-contour-blanc"] {
    width:155px;
    margin-block:-3.9px;
  }
}
/* END LOGO TRIAL 20261023 */
