/* Editorial sections only: the expandable project plugin keeps its styles. */
.animations-editorial :where(.wp-block-group)>*{margin-block:0}
.animations-editorial .wp-block-button{margin:0}
@font-face {font-family: AnimationsDisplay; src: url('/wp-content/themes/debrouillards2026/assets/fonts/RobotoCondensed-Header-VariableFont_wght.woff2') format('woff2'); font-weight: 100 900; font-display: swap;}
.animations-editorial{box-sizing: border-box; color: #111; font-family: 'Roboto Condensed',RobotoCondensed,Arial,sans-serif; font-size: clamp(20px,1.4vw,24px); font-weight: 300; line-height: 1.4; overflow: clip;}
.animations-editorial *{box-sizing: border-box; min-width: 0;}
.animations-editorial .animations-wrap{width: calc(100% - 80px); max-width: 1920px; margin-inline: auto;}
.animations-editorial .animations-prose :is(h1,h2){font-family: AnimationsDisplay,'Roboto Condensed',sans-serif; color: #111; font-weight: 900; line-height: 1.07; margin: 0 0 30px;}
.animations-editorial h1{font-size: clamp(44px,4.1vw,76px); letter-spacing: -.6px;}
.animations-editorial h2{font-size: clamp(32px,2.6vw,50px);}
.animations-editorial :is(h1,h2) strong{font-weight: inherit;}
.animations-editorial .animations-prose p{font-size: inherit; font-weight: 300; line-height: inherit; margin: 0 0 22px;}
.animations-editorial .animations-prose p:last-child{margin-bottom: 0;}
.animations-editorial .animations-photo{position: relative; isolation: isolate; width: 100%; max-width: 800px; margin: 24px 0; padding: 10px; transform: rotate(2deg);}
.animations-editorial .animations-photo:before{content: ''; position: absolute; z-index: -1; inset: -28px 0 -20px 15px; background: #00b1eb; border-radius: 47% 53% 61% 39% / 55% 43% 57% 45%; transform: rotate(9deg);}
.animations-editorial .animations-photo img{display: block; width: 100%; height: auto; aspect-ratio: 3/2; object-fit: cover; border: 2px solid #111; box-shadow: 7px 8px 0 #111;}
.animations-hero{width: calc(100% + 2 * var(--debrouillards-page-content-padding,40px)); max-width: none; margin-inline: calc(-1 * var(--debrouillards-page-content-padding,40px)) !important; margin-block-start: calc(-1 * var(--debrouillards-page-hero-top,68px)) !important; padding: 68px 0 78px; background: linear-gradient(180deg,#e1ecf2 0%,#e1ecf2 38%,#fff 100%);}
.animations-hero .animations-hero-layout{display: grid; grid-template-columns: minmax(0,1.15fr) minmax(0,.85fr); gap: clamp(40px,6vw,115px); align-items: center;}
.animations-hero .animations-photo{justify-self: center;}
.animations-training{width: calc(100% + 2 * var(--debrouillards-page-content-padding,40px)); max-width: none; margin-inline: calc(-1 * var(--debrouillards-page-content-padding,40px)) !important; padding: 65px 0 55px; background: #fff;}
.animations-training .animations-training-layout{display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: clamp(32px,4vw,75px); align-items: center; padding: 50px; border: 0; border-radius: 45% 5% 3% 3% / 7% 5% 3% 3%; background: #e1ecf2; box-shadow: none;}
.animations-training .animations-prose{padding: 0; border: 0; background: transparent; box-shadow: none;}
.animations-training .animations-photo.animations-photo--training{max-width: 650px; margin: 8px 0; padding: 10px; transform: rotate(-2deg); justify-self: center;}
.animations-training .animations-photo:before{content: none;}
.animations-training .animations-photo img{border: 2px solid #111; box-shadow: 7px 8px 0 #111;}
.animations-editorial .animations-actions{display: flex; flex-wrap: wrap; gap: 20px; margin: 30px 0 0;}
.animations-editorial .animations-action .wp-block-button__link{display: inline-block; max-width: 100%; padding: 16px 25px; border: 2px solid #e6007e; border-radius: 0; background: #e6007e; color: #fff; font-family: AnimationsDisplay,'Roboto Condensed',sans-serif; font-size: 21px; font-weight: 800; line-height: 1.2; text-decoration: none; text-align: center; box-shadow: none;}
.animations-editorial .animations-action .wp-block-button__link:hover{background: #c5006c; border-color: #c5006c; color: #fff;}
.animations-editorial .animations-action .wp-block-button__link:focus-visible{outline: 3px solid #43358b; outline-offset: 5px;}
.animations-editorial .animations-action--outline .wp-block-button__link{background: transparent; color: #e6007e;}
.animations-related{width: calc(100% + 2 * var(--debrouillards-page-content-padding,40px)); max-width: none; margin-inline: calc(-1 * var(--debrouillards-page-content-padding,40px)) !important; padding: 15px 0 20px;}
.animations-related .animations-related-links{display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 24px 40px;}
@media (min-width:2000px){
.animations-editorial .animations-wrap{width: calc(100% - 160px);}
}
@media (max-width:1100px){
.animations-hero .animations-hero-layout{gap: 38px; grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr);}
.animations-editorial h1{font-size: clamp(40px,4.4vw,57px);}
.animations-training .animations-training-layout{gap: 38px;}
}
@media (max-width:781px){
.animations-editorial .animations-wrap{width: calc(100% - 40px);}
.animations-hero{padding: 42px 0 48px;}
.animations-hero .animations-hero-layout,.animations-training .animations-training-layout{grid-template-columns: minmax(0,1fr); gap: 32px;}
.animations-editorial h1{font-size: 43px;}
.animations-editorial h2{font-size: 33px;}
.animations-editorial .animations-photo{max-width: 560px; margin-inline: auto;}
.animations-training{padding: 40px 0;}
.animations-training .animations-training-layout{padding: 28px 20px;}
.animations-related{padding-top: 10px;}
.animations-related .animations-related-links{align-items: stretch; gap: 20px;}
.animations-editorial .animations-action .wp-block-button__link{font-size: 20px;}
}
@media (max-width:420px){
.animations-editorial .animations-wrap{width: calc(100% - 28px);}
.animations-editorial h1{font-size: 39px;}
.animations-editorial h2{font-size: 31px;}
.animations-editorial .animations-photo{padding: 8px;}
.animations-editorial .animations-photo:before{inset: -18px 0 -18px 10px;}
.animations-editorial .animations-action .wp-block-button__link{font-size: 19px; padding: 15px 20px;}
}

