.wp-block-studio-perspectives-section {
background-size: cover;
display: flex;
flex-direction: column;
width: 100%;
position: relative;
}
.wp-block-studio-perspectives-section:after {
content: "";
clear: both;
display: block;
}.entry-content hr.wp-block-studio-perspectives-separator,
hr.wp-block-studio-perspectives-separator {
background-color: #fff;
height: 17px;
width: 100%;
padding: 0;
display: block;
border: none;
margin: 40px 0;
}
hr.wp-block-studio-perspectives-separator.dashed-separator {
height: 1px;
background-color: transparent;
background-image: linear-gradient(to right, #fff 50%, rgba(255, 255, 255, 0) 0%);
background-position: bottom left;
background-size: 10px 1px;
background-repeat: repeat-x; }
hr.wp-block-studio-perspectives-separator::before,
hr.wp-block-studio-perspectives-separator::after {
content: none !important;
}.wp-block-studio-perspectives-layout {
display: flex;
align-items: flex-start;
gap: 70px;
width: 100%;
}
.wp-block-studio-perspectives-layout.compact:not(.without-subtitle) {
align-items: stretch;
}
.wp-block-studio-perspectives-layout .layout-title {
display: flex;
justify-content: space-between;
flex-grow: 1;
max-width: calc(50% - 35px);
}
.wp-block-studio-perspectives-layout.without-title .layout-title {
display: flex;
justify-content: flex-end;
}
.wp-block-studio-perspectives-layout.compact .layout-title {
flex-direction: column;
justify-content: flex-start;
}
.wp-block-studio-perspectives-layout.compact .layout-title h2 {
order: 2;
flex-basis: auto;
font-size: 87px !important;
line-height: 87px !important;
left: -5px;
white-space: unset;
}
.wp-block-studio-perspectives-layout.compact .layout-title .h3 {
order: 1;
top: -60px;
}
.wp-block-studio-perspectives-layout .layout-title h2 {
font-size: 300px !important;
line-height: 300px !important;
color: #000;
order: 1;
position: relative;
left: -22px;
min-width: 210px;
top: -35px;
white-space: nowrap;
}
.wp-block-studio-perspectives-layout .layout-title .h3 {
color: #A57045;
font-weight: 500;
order: 2;
position: relative;
top: 11px;
}
.wp-block-studio-perspectives-layout.without-title .layout-title .h3 {
top: 1px;
}
a.discover {
color: #A57045;
position: relative;
padding-right: 30px;
margin-top: 50px;
display: inline-block;
font-weight: 500;
}
a.discover:before {
display: block;
content: ' ';
height: 2px;
background-color: #A57045;
position: absolute;
width: 100%;
bottom: -5px;
}
a.discover:after {
overflow: hidden;
content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 26 26"><g transform="translate(-113.844 24.242) rotate(-45)"><line x2="26" transform="translate(88.5 72.5) rotate(45)" fill="none" stroke="%23a57045" stroke-width="2"/><line x2="26" transform="translate(88.5 90.783) rotate(-45)" fill="none" stroke="%23a57045" stroke-width="2"/></g></svg>');
height: 0;
width: 48px;
position: absolute;
bottom: -3px;
right: -50px;
display: inline-flex;
align-items: flex-end;
justify-content: center;
}
a.discover:hover:after {
animation: hover-animate2 .5s ease-in-out;
animation-fill-mode: forwards;
}
a.discover--white {
color: #fff;
margin-top: 0;
padding-right: 0;
}
a.discover--white:before {
background-color: transparent;
}
a.discover--white:after {
width: 60px;
content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 52 52"><g transform="translate(-113.844 37.112) rotate(-45)"><line x2="51.596" transform="translate(88.5 72.5) rotate(45)" fill="none" stroke="%23fff" stroke-width="2"/><line x2="51.596" transform="translate(88.5 108.984) rotate(-45)" fill="none" stroke="%23fff" stroke-width="2"/></g></svg>') !important;
}
@keyframes hover-animate2 {
0% {
height: 0;
}
50% {
height: 0;
}
100% {
height: 48px;
}
}
.wp-block-studio-perspectives-layout .layout-content {
flex: 1 1 auto;
max-width: calc(50% - 35px);
min-width: calc(50% - 35px);
}
.wp-block-studio-perspectives-layout .layout-content p:last-child {
margin-bottom: 0;
}
.wp-block-studio-perspectives-layout .layout-content.with-delimiter {
position: relative;
--delimiterBeforeWidth: 100%;
}
.wp-block-studio-perspectives-layout .layout-content.with-delimiter:before {
display: block;
content: ' ';
height: 1px;
background-color: transparent;
background-image: linear-gradient(to right, currentColor 50%, rgba(255, 255, 255, 0) 0%);
background-position: bottom left;
background-size: 10px 1px;
background-repeat: repeat-x;
position: absolute;
width: var(--delimiterBeforeWidth, 100%);
top: 0;
} .wp-block-studio-perspectives-layout .layout-content h2 {
position: relative;
margin-bottom: 30px;
--delimiterBeforeWidth: 100%;
}
.wp-block-studio-perspectives-layout:not(.without-title-content-separator) .layout-content h2:before {
display: block;
content: ' ';
height: 1px;
background-color: transparent;
background-image: linear-gradient(to right, currentColor 50%, rgba(255, 255, 255, 0) 0%);
background-position: bottom left;
background-size: 10px 1px;
background-repeat: repeat-x;
position: absolute;
width: var(--delimiterBeforeWidth, 100%);
bottom: -15px;
}
.wp-block-studio-perspectives-layout.without-title-content-separator .layout-content h2:before {
display: none;
}
.wp-block-studio-perspectives-layout.without-title.without-subtitle .layout-title {
display: none;
}
.wp-block-studio-perspectives-layout.without-title.without-subtitle .layout-content {
flex-basis: 1325px;
max-width: 1325px;
}
.wp-block-studio-perspectives-layout.without-title.without-subtitle.content-right {
justify-content: flex-end;
}
.wp-block-studio-perspectives-layout.without-title.without-subtitle.content-center {
justify-content: center;
}
@media all and (max-width: 1200px) {
.wp-block-studio-perspectives-layout {
gap: 30px;
}
.wp-block-studio-perspectives-layout .layout-title {
flex-direction: column;
flex-basis: auto;
}
.wp-block-studio-perspectives-layout .layout-title,
.wp-block-studio-perspectives-layout .layout-content {
width: calc(50% - 15px);
max-width: calc(50% - 15px);
min-width: calc(50% - 15px);
}
.wp-block-studio-perspectives-layout .layout-title h2 {
order: 2;
flex-basis: auto;
left: -5px;
min-width: auto;
top: 10px;
font-size: 87px !important;
line-height: 87px !important;
}
.wp-block-studio-perspectives-layout .layout-title .h3 {
order: 1;
flex-basis: auto;
}
}
@media all and (max-width: 767px) {
#text-more-precise > span {
display: block;
font-size: 70px !important;
line-height: 80px !important;
text-align: left;
}
.wp-block-studio-perspectives-layout {
flex-direction: column;
}
.wp-block-studio-perspectives-layout .layout-content,
.wp-block-studio-perspectives-layout.without-title .layout-title,
.wp-block-studio-perspectives-layout.without-subtitle .layout-title h2,
.wp-block-studio-perspectives-layout.without-title.without-subtitle .layout-content {
flex-basis: auto;
}
.wp-block-studio-perspectives-layout .layout-title,
.wp-block-studio-perspectives-layout .layout-content {
width: 100%;
max-width: 100%;
min-width: unset;
}
.wp-block-studio-perspectives-layout .layout-title .h3 h3 {
font-size: 20px !important;
line-height: 30px !important;
}
.wp-block-studio-perspectives-layout.compact .layout-title h2,
.wp-block-studio-perspectives-layout .layout-title h2 {
font-size: 45px !important;
line-height: 55px !important;
}
}
@media all and (max-width: 1200px) {
.wp-block-studio-perspectives-layout .layout-title .h3 .discover {
margin: 15px 0 !important;
}
}
@media all and (max-width: 1050px) {
.wp-block-studio-perspectives-layout {
flex-direction: column;
}
.wp-block-studio-perspectives-layout.without-title.without-subtitle .layout-content {
flex-basis: auto;
}
.wp-block-studio-perspectives-layout .layout-title {
flex-basis: auto !important;
padding-bottom: 0 !important;
padding-top: 20px !important;
}
.wp-block-studio-perspectives-layout.compact .layout-title .h3 {
top: 0;
}
.wp-block-studio-perspectives-layout .layout-title,
.wp-block-studio-perspectives-layout .layout-content {
width: 100%;
max-width: 100%;
min-width: unset;
}
}.wp-block-studio-perspectives-skills {
display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100% / 3, max(300px, 100% / 3)), 1fr));
row-gap: 90px;
width: 100%;
}
.wp-block-studio-perspectives-skills.grid-1 {
grid-template-columns: repeat(1, 1fr);
}
.wp-block-studio-perspectives-skills.grid-2 {
grid-template-columns: repeat(2, 1fr);
}
.wp-block-studio-perspectives-skills h3 {
color: #fff;
font-size: 30px !important;
line-height: 30px !important;
position: relative;
margin-top: 70px;
padding-right: 90px;
--delimiterBeforeWidth: 100%;
}
.wp-block-studio-perspectives-skills img {
width: 63px;
}
.wp-block-studio-perspectives-skills h3:before {
display: block;
content: ' ';
height: 1px;
background-color: transparent;
background-image: linear-gradient(to right, currentColor 50%, rgba(255, 255, 255, 0) 0%);
background-position: bottom left;
background-size: 10px 1px;
background-repeat: repeat-x;
position: absolute;
width: var(--delimiterBeforeWidth, 100%);
top: -35px;
}
@media all and (max-width: 850px) {
.wp-block-studio-perspectives-skills {
row-gap: 40px;
}
.wp-block-studio-perspectives-skills .skill {
text-align: center;
}
.wp-block-studio-perspectives-skills h3 {
padding-right: 0;
font-size: 14px !important;
line-height: 24px !important;
}
.wp-block-studio-perspectives-skills img {
width: 50px;
}
}.wp-block-studio-perspectives-puzzle {
display: grid;
grid-template-columns: 1fr 1fr;
max-width: 1322px;
background: url(//studio-perspectives.com/wp-content/themes/studio-perspectives/images/puzzle-logo-center.svg) no-repeat, radial-gradient(circle, rgba(165, 112, 69, 1) 40%, rgba(165, 112, 69, 0) 40%) no-repeat;
background-size: 21%;
background-position: calc(50% - 1px) calc(50% - 5px);
width: 100%;
}
.wp-block-studio-perspectives-puzzle .piece {
position: relative;
z-index: 1;
cursor: pointer;
}
.wp-block-studio-perspectives-puzzle .piece:hover {
z-index: 2;
}
.wp-block-studio-perspectives-puzzle .piece:hover svg {
filter: drop-shadow(5px 5px 10px rgba(0, 0, 0, .5));
transition: .3s;
}
.wp-block-studio-perspectives-puzzle .piece h3,
.wp-block-studio-perspectives-puzzle .piece .puzzle-content {
position: absolute;
z-index: 5;
text-align: center;
}
.wp-block-studio-perspectives-puzzle .piece .puzzle-content {
font-size: 20px;
line-height: 20px;
font-weight: 500;
}
.wp-block-studio-perspectives-puzzle .piece h3 {
display: inline-flex;
align-items: center;
top: 50%;
transform: translateY(-50%);
font-size: 35px;
line-height: 45px;
font-weight: 400;
max-width: 315px;
color: #fff;
}
.wp-block-studio-perspectives-puzzle .piece span {
display: inline-flex;
width: 42px;
height: 42px;
border-radius: 99px;
background: #A57045;
color: #fff;
justify-content: center;
align-items: center;
margin-bottom: 10px;
}
.wp-block-studio-perspectives-puzzle .piece p {
color: #000;
text-align: center;
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(3),
.wp-block-studio-perspectives-puzzle .piece:nth-child(4) {
top: -4px;
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(2),
.wp-block-studio-perspectives-puzzle .piece:nth-child(4) {
left: -1px;
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(1) h3 {
left: 45px;
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(2) h3 {
right: 45px;
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(3) h3 {
left: 45px;
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(4) h3 {
right: 45px;
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(1) .puzzle-content {
right: calc(9%);
top: calc(47%);
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(2) .puzzle-content {
left: calc(9%);
top: calc(47%);
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(3) .puzzle-content {
right: calc(9%);
top: calc(30%);
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(4) .puzzle-content {
left: calc(9%);
top: calc(30%);
}
@media all and (max-width: 1299px) {
.wp-block-studio-perspectives-puzzle .piece h3 {
transform: translateY(0);
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(1) h3 {
top: 45px;
text-align: left;
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(2) h3 {
top: 45px;
text-align: right;
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(3) h3 {
top: unset;
bottom: 45px;
text-align: left;
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(4) h3 {
top: unset;
bottom: 45px;
text-align: right;
}
.wp-block-studio-perspectives-puzzle .piece .puzzle-content span {
width: 25px;
height: 25px;
font-size: 10px;
line-height: 14px;
margin-bottom: 5px;
}
}
@media all and (max-width: 1130px) {
.wp-block-studio-perspectives-puzzle .piece h3 {
line-height: 30px;
max-width: unset;
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(1) h3 {
top: 20px;
left: 20px;
right: 20px;
text-align: left;
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(2) h3 {
top: 20px;
right: 20px;
left: 20px;
text-align: right;
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(3) h3 {
top: unset;
bottom: 20px;
left: 20px;
right: 20px;
text-align: left;
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(4) h3 {
top: unset;
bottom: 20px;
right: 20px;
left: 20px;
text-align: right;
}
}
@media all and (max-width: 950px) {
.wp-block-studio-perspectives-puzzle .piece h3 {
font-size: 25px;
line-height: 30px;
}
.wp-block-studio-perspectives-puzzle .piece .puzzle-content {
font-size: 10px;
line-height: 14px;
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(3) h3 {
top: unset;
bottom: 10px;
left: 20px;
right: 20px;
text-align: left;
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(4) h3 {
top: unset;
bottom: 10px;
right: 20px;
left: 20px;
text-align: right;
}
}
@media all and (max-width: 650px) {
.wp-block-studio-perspectives-puzzle .piece h3 {
font-size: 15px;
line-height: 15px;
}
}
@media all and (max-width: 600px) {
.wp-block-studio-perspectives-puzzle .piece h3 {
top: 10px!important;
bottom: 10px!important;
left: 10px!important;
right: 10px!important;
text-align: center;
}
.wp-block-studio-perspectives-puzzle .piece .puzzle-content {
display: none;
}
.wp-block-studio-perspectives-puzzle svg .black-circle {
display: none;
}
.wp-block-studio-perspectives-puzzle .piece .puzzle-content {
font-size: 10px;
line-height: 14px;
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(3) h3 {
top: unset;
bottom: 10px;
left: 20px;
right: 20px;
text-align: left;
}
.wp-block-studio-perspectives-puzzle .piece:nth-child(4) h3 {
top: unset;
bottom: 10px;
right: 20px;
left: 20px;
text-align: right;
}
}.wp-block-studio-perspectives-expertises {
display: grid;
gap: 30px;
width: 100%;
grid-template-columns: repeat(auto-fill, minmax(285px, 285px));
grid-auto-rows: 1fr;
align-items: start;
justify-content: center;
background: #000;
color: #fff;
}
.wp-block-studio-perspectives-expertises .expertise {
display: flex;
flex-direction: column;
height: 100%
}
.wp-block-studio-perspectives-expertises .expertise .expertise-layout {
flex: 1 1 auto;
padding: 20px;
background: linear-gradient(0deg, rgba(13, 11, 10, 1) 20%, rgba(112, 77, 47, 1) 48.7%, rgba(165, 112, 69, 1) 100%);
}
.wp-block-studio-perspectives-expertises .expertise .expertise-layout h2 {
font-size: 50px;
line-height: 70px;
border-bottom: 6px solid #fff;
margin: 30px 0;
}
.wp-block-studio-perspectives-expertises .expertise ul {
list-style: none;
list-style-position: inside;
width: 100%;
font-size: 15px;
line-height: 20px;
margin-bottom: 200px;
}
.wp-block-studio-perspectives-expertises .expertise ul li {
margin-bottom: 10px;
}.wp-block-studio-perspectives-timeline {
display: block;
width: 100%;
background: url(//studio-perspectives.com/wp-content/themes/studio-perspectives/images/dash.svg) repeat-y;
background-size: 6px 7px;
background-position: calc(50% - 3px);
position: relative;
}
.wp-block-studio-perspectives-timeline h2 {
color: #fff;
padding-top: 80px;
}
.wp-block-studio-perspectives-timeline .timeline-header {
position: sticky;
top: 100px;
z-index: 10;
}
.wp-block-studio-perspectives-timeline .timeline-header hr {
margin: 0 auto;
position: relative;
z-index: -1;
}
.wp-block-studio-perspectives-timeline .timeline-wrapper {
min-height: calc(100vh - 100px);
margin-top: 100px;
position: relative;
}
.wp-block-studio-perspectives-timeline .cursor-pos {
position: sticky;
top: 616px;
left: calc(50% - 30px);
width: 30px;
display: inline-block;
border-bottom: 6px solid #9D6D45;
opacity: 0;
}
@media all and (max-width: 767px) {
.wp-block-studio-perspectives-timeline .cursor-pos {
display: none;
}
.wp-block-studio-perspectives-timeline {
background-image: unset;
}
.wp-block-studio-perspectives-timeline .timeline-header {
position: relative;
}
.wp-block-studio-perspectives-timeline .timeline-header h2 {
opacity: 1 !important;
}
.wp-block-studio-perspectives-timeline .timeline-wrapper {
margin-top: 200px;
}
}.wp-block-studio-perspectives-timeline-element {
display: flex;
justify-content: flex-end;
}
.wp-block-studio-perspectives-timeline-element .timeline-element-header { padding-right: 40px;
}
.wp-block-studio-perspectives-timeline-element .timeline-element-header h3 {
color: #9D6D45;
text-align: right;
}
.wp-block-studio-perspectives-timeline-element .timeline-element-header h2 {
padding: 0;
text-align: right;
max-width: 365px;
}
.wp-block-studio-perspectives-timeline-element .timeline-element-content {
min-width: 50%;
max-width: 50%;
width: 50%;
background-color: #fff;
padding: 60px 0 60px 60px;
font-size: 15px;
line-height: 20px;
position: relative;
}
.wp-block-studio-perspectives-timeline-element .timeline-element-content:before {
display: block;
content: ' ';
height: 1px;
background-color: transparent;
background-image: linear-gradient(to right, currentColor 50%, rgba(255, 255, 255, 0) 0%);
background-position: bottom left;
background-size: 10px 1px;
background-repeat: repeat-x;
position: absolute;
width: 100%;
top: 2px;
left: 0;
}
.wp-block-studio-perspectives-timeline-element .timeline-element-content img {
max-width: 100%;
width: 50%;
display: inline-block;
margin-bottom: 70px;
}
.wp-block-studio-perspectives-timeline-element .timeline-element-content ul {
list-style: square;
list-style-position: inside;
max-width: 640px;
}
.wp-block-studio-perspectives-timeline-element .timeline-element-content ul li {
margin-bottom: 10px;
}
@media all and (max-width: 1100px) {
.wp-block-studio-perspectives-timeline-element .timeline-element-content {
padding: 30px;
font-size: 15px;
line-height: 20px;
}
}
@media all and (max-width: 767px) {
.wp-block-studio-perspectives-timeline-element {
flex-direction: column;
justify-content: center;
align-items: center;
}
.wp-block-studio-perspectives-timeline-element .timeline-element-header {
width: 100%;
display: flex;
margin: 30px 0;
padding: 0 15px;
flex-wrap: wrap;
}
.wp-block-studio-perspectives-timeline-element .timeline-element-header h3 {
font-size: 40px !important;
line-height: 40px !important;
margin-right: 15px;
}
.wp-block-studio-perspectives-timeline-element .timeline-element-header h2 {
flex-grow: 1;
max-width: unset;
text-align: left;
}
.wp-block-studio-perspectives-timeline-element .timeline-element-content {
min-width: 100%;
max-width: unset;
width: calc(100% + 30px);
}
.wp-block-studio-perspectives-timeline-element .timeline-element-content:before {
display: none;
}
}.wp-block-studio-perspectives-container {
flex-grow: 1;
width: 100%;
display: flex;
background-size: cover;
background-position: center;
}
@media all and (max-width: 767px) {
.wp-block-studio-perspectives-container > .container-wrapper {
min-width: 100% !important;
max-width: 100% !important;
}
}
.wp-block-studio-perspectives-container.dark {
color: #fff;
}
.wp-block-studio-perspectives-container.horizontal-flex-start {
justify-content: flex-start;
}
.wp-block-studio-perspectives-container.horizontal-flex-end {
justify-content: flex-end;
}
.wp-block-studio-perspectives-container.horizontal-center {
justify-content: center;
}
.wp-block-studio-perspectives-container.vertical-flex-start {
align-items: flex-start;
}
.wp-block-studio-perspectives-container.vertical-flex-end {
align-items: flex-end;
}
.wp-block-studio-perspectives-container.vertical-center {
align-items: center;
}.wp-block-studio-perspectives-team {
display: grid;
column-gap: 30px;
row-gap: 80px;
width: 100%;
grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
grid-auto-rows: 1fr;
align-items: start;
background: #000;
color: #fff;
}
.wp-block-studio-perspectives-team .teammate {
display: inline-flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
}
.wp-block-studio-perspectives-team .teammate .img-layout {
width: 285px;
height: 370px;
background-color: #fff;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.wp-block-studio-perspectives-team .teammate .img-layout img {
object-fit: cover;
width: 100%;
height: 100%;
display: inline-block;
}
.wp-block-studio-perspectives-team .teammate h3 {
margin-top: 40px;
margin-bottom: 10px;
font-size: 25px;
line-height: 30px;
font-weight: 500;
display: inline-block;
}
.wp-block-studio-perspectives-team .teammate ul {
list-style: disc;
list-style-position: inside;
font-size: 12px;
line-height: 22px;
display: inline-block;
}
.wp-block-studio-perspectives-team .teammate ul li {
margin-bottom: 0px;
}
@media all and (max-width: 767px) {
.wp-block-studio-perspectives-team {
grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
}
.wp-block-studio-perspectives-team .teammate {
align-items: center;
}
}.wp-block-studio-perspectives-plan {
max-width: 1325px;
width: 100%;
background-color: #fff;
padding: 40px;
}
.wp-block-studio-perspectives-plan .map {
max-width: 1325px;
width: 100%;
}
.wp-block-studio-perspectives-plan .label,
.wp-block-studio-perspectives-plan .label-sm,
.wp-block-studio-perspectives-plan .nantes-line,
.wp-block-studio-perspectives-plan .paris-line,
.wp-block-studio-perspectives-plan .angers-line,
.wp-block-studio-perspectives-plan .geneve-line,
.wp-block-studio-perspectives-plan .clermont-line,
.wp-block-studio-perspectives-plan .bordeaux-line,
.wp-block-studio-perspectives-plan .nantes-dot,
.wp-block-studio-perspectives-plan .paris-dot,
.wp-block-studio-perspectives-plan .angers-dot,
.wp-block-studio-perspectives-plan .geneve-dot,
.wp-block-studio-perspectives-plan .clermont-dot,
.wp-block-studio-perspectives-plan .bordeaux-dot {
opacity: 0;
}
@media all and (max-width: 767px) {
.wp-block-studio-perspectives-plan {
padding: 0;
width: calc(100% + 30px);
overflow: hidden;
align-self: center;
}
.wp-block-studio-perspectives-plan svg .label,
.wp-block-studio-perspectives-plan svg .label-sm {
font-size: 35px;
font-weight: 500;
text-transform: uppercase;
}
.wp-block-studio-perspectives-plan svg .paris-label-2 {
transform: translate(-75px, 7px);
}
.wp-block-studio-perspectives-plan svg .geneve-label-2 {
transform: translate(-75px, 5px);
}
.wp-block-studio-perspectives-plan svg .angers-label-2 {
transform: translate(-125px, 6px);
}
.wp-block-studio-perspectives-plan svg .nantes-label-2 {
transform: translate(-20px, 6px);
}
.wp-block-studio-perspectives-plan svg .clermont-label-2 {
transform: translate(-150px, 6px);
}
.wp-block-studio-perspectives-plan svg .bordeaux-label-2 {
transform: translate(-150px, 6px);
}
.wp-block-studio-perspectives-plan svg .angers-label {
transform: translate(-10px, 10px);
}
.wp-block-studio-perspectives-plan svg .bordeaux-label {
transform: translate(-10px, 10px);
}
}.wp-block-studio-perspectives-places.dark {
color: #fff;
}
.wp-block-studio-perspectives-places {
display: grid;
width: 100%;
grid-template-columns: 1fr 1fr;
grid-auto-rows: 1fr;
gap: 60px;
margin-top: 60px!important;
}
.wp-block-studio-perspectives-places .place {
max-width: 420px;
}
.wp-block-studio-perspectives-places .place h3 {
font-size: 40px;
font-weight: 500;
line-height: 50px;
border-bottom: 6px solid currentColor;
margin-bottom: 20px;
padding-right: 30px;
}
.wp-block-studio-perspectives-places .place p {
font-size: 20px;
font-weight: 500;
line-height: 30px;
margin-bottom: 0;
padding-right: 30px;
}
.wp-block-studio-perspectives-places .place p:last-of-type {
border-top: 1px solid currentColor;
margin-top: 15px;
padding-top: 15px;
}
@media all and (max-width: 1100px) {
.wp-block-studio-perspectives-places {
grid-template-columns: 1fr;
}
}.wp-block-studio-perspectives-case-study-header {
width: 100%;
display: flex;
justify-content: space-between;
}
.wp-block-studio-perspectives-case-study-header.dark {
color: #fff;
}
.wp-block-studio-perspectives-case-study-header > img {
max-width: 875px;
width: 50%;
display: inline-block;
height: auto;
object-fit: cover;
aspect-ratio: 875/1150;
}
.wp-block-studio-perspectives-case-study-header > .stats {
width: 50%;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: flex-end;
}
.wp-block-studio-perspectives-case-study-header h3 {
font-size: 170px;
line-height: 150px;
text-align: right;
}
.wp-block-studio-perspectives-case-study-header p {
font-size: 18px;
line-height: 25px;
padding: 0 18px;
text-align: right;
}
@media all and (max-width: 1300px) {
.wp-block-studio-perspectives-case-study-header h3 {
font-size: 140px;
line-height: 120px;
}
.wp-block-studio-perspectives-case-study-header p { padding: 0 10px;
}
}
@media all and (max-width: 1000px) {
.wp-block-studio-perspectives-case-study-header h3 {
font-size: 110px;
line-height: 90px;
}
}
@media all and (max-width: 767px) {
.wp-block-studio-perspectives-case-study-header h3 {
font-size: 140px;
line-height: 120px;
text-align: center;
}
.wp-block-studio-perspectives-case-study-header {
flex-direction: column;
}
.wp-block-studio-perspectives-case-study-header > img {
width: 100%;
}
.wp-block-studio-perspectives-case-study-header > .stats {
margin-top: 50px;
width: 100%;
align-items: center;
text-align: center;
}
.wp-block-studio-perspectives-case-study-header p {
padding: 0;
text-align: center;
}
}
@media all and (max-width: 450px) {
.wp-block-studio-perspectives-case-study-header h3 {
font-size: 90px;
line-height: 70px;
text-align: center;
}
}.wp-block-studio-perspectives-diaporama {
max-width: 100%;
width: 100%;
position: relative;
}
.wp-block-studio-perspectives-diaporama > .diapo-mask {
display: flex;
flex-wrap: nowrap;
-webkit-mask-image: linear-gradient(to right, transparent 0, black 28%, black 72%, transparent 100%);
mask-image: linear-gradient(to right, transparent 0, black 28%, black 72%, transparent 100%);
overflow: hidden;
max-width: 100%;
}
.wp-block-studio-perspectives-diaporama > svg {
position: absolute;
z-index: 9;
cursor: pointer;
width: 150px;
display: block;
left: 0;
top: 50%;
transform: translateY(-50%);
color: #fff;
opacity: .5;
transition: opacity .3s;
}
.wp-block-studio-perspectives-diaporama > svg:hover {
opacity: 1;
}
.wp-block-studio-perspectives-diaporama > svg:last-of-type {
transform: rotate(180deg) translateY(50%);
left: unset;
right: 0;
}
.wp-block-studio-perspectives-diaporama .diapo-wrapper {
display: flex;
align-items: flex-start;  }
.wp-block-studio-perspectives-diaporama .diapo-wrapper .diapo {
width: 460px;
padding: 20px;
position: relative;
}
.wp-block-studio-perspectives-diaporama .diapo-wrapper h3 {
position: absolute;
display: block;
padding: 50px 100px;
left: 0;
bottom: 0;
width: 100%;
max-width: 900px;
}
.wp-block-studio-perspectives-diaporama .diapo-wrapper img {
aspect-ratio: 420/535;
object-fit: cover;
display: inline-block;
max-width: 100%;
}
.wp-block-studio-perspectives-diaporama.images-full-width .diapo-wrapper .diapo {
width: 100%;
height: calc(100vh - 100px);
padding: 0;
}
.wp-block-studio-perspectives-diaporama.images-full-width .diapo-wrapper img {
aspect-ratio: unset;
width: 100%;
height: 100%;
}
@keyframes infinite-scroll {
from {
transform: translateX(0);
}
to {
transform: translateX(-100%);
}
}
@media all and (max-width: 767px) {
.wp-block-studio-perspectives-diaporama {
padding: 50px 0;
}
.wp-block-studio-perspectives-diaporama .diapo-wrapper .diapo {
width: 250px;
padding: 10px;
}
.wp-block-studio-perspectives-diaporama .diapo-wrapper h3 {
padding: 30px;
}
.wp-block-studio-perspectives-diaporama > svg {
max-width: 100px;
}
}.wp-block-studio-perspectives-case-block {
margin-top: 100px;
width: 100%;
}
.wp-block-studio-perspectives-case-block .case-block-wrapper {
display: flex;
width: 100%;
justify-content: space-between;
gap: 30px;
}
.wp-block-studio-perspectives-case-block.case-block-content-left .case-block-wrapper {
flex-direction: row-reverse;
}
.wp-block-studio-perspectives-case-block .case-block-wrapper .case-block-image {
width: 50%;
}
.wp-block-studio-perspectives-case-block .case-block-wrapper .case-block-image img {
max-width: 100%;
max-height: 650px;
width: 100%;
height: 100%;
object-fit: cover;
}
.wp-block-studio-perspectives-case-block .case-block-wrapper .case-block-content {
width: 50%;
padding: 30px 0;
}
.wp-block-studio-perspectives-case-block .case-block-wrapper .case-block-content h2 {
position: relative;
margin-bottom: 30px;
--delimiterBeforeWidth: 100%;
}
.wp-block-studio-perspectives-case-block .case-block-wrapper .case-block-content h2:before {
display: block;
content: ' ';
height: 1px;
background-color: transparent;
background-image: linear-gradient(to right, currentColor 50%, rgba(255, 255, 255, 0) 0%);
background-position: bottom left;
background-size: 10px 1px;
background-repeat: repeat-x;
position: absolute;
width: var(--delimiterBeforeWidth, 100%);
bottom: -5px;
}
@media all and (max-width: 767px) {
.wp-block-studio-perspectives-case-block .case-block-wrapper {
flex-direction: column !important;
}
.wp-block-studio-perspectives-case-block .case-block-wrapper .case-block-image,
.wp-block-studio-perspectives-case-block .case-block-wrapper .case-block-content {
width: 100%;
}
.wp-block-studio-perspectives-case-block .case-block-wrapper .case-block-content {
padding-top: 0;
padding-bottom: 0;
}
}