.main-navigation {
background: #fff;
padding: 14px 40px;
border-radius: 50px;
}
.nav-menu > li > a:hover {
color: var(--theme-color);
}
li#menu-item-486 {background-color: var(--theme-color);border-radius: 100px;}
li#menu-item-486 a {
color: #fff;
padding: 10px 20px;
}
li#menu-item-486:hover {
background: var(--theme-color-light);
}
li#menu-item-486:hover a {
color: var(--theme-color);
}
.prise-rdv {
background: var(--theme-color);
padding: 0 20px;
border-radius: 50px;
}
.prise-rdv a {
color: #fff !important;
}
.top-banner {
background: var(--theme-color);
padding: 4px 0;
}
.top-banner span {
color: var(--theme-color-light);
}
.top-banner a {
background: var(--theme-color-light);
color: var(--theme-color);
}
section {
padding: 60px;
}
.paragraphe {
max-width: 795px;
margin-left: auto;
margin-right: auto;
}
span.top-title {
font-family: var(--font-display);
font-weight: 500;
font-size: 18px;
line-height: 100%;
letter-spacing: 0%;
}
.page-template-page-video .top-banner {
background: var(--theme-color-light);
}
.page-template-page-video .top-banner a {
color: var(--theme-color-light);
background: var(--theme-color);
}
.page-template-page-video .top-banner span {
color: var(--theme-color);
} .hero-content p {
line-height: 27px;
font-size: 18px;
font-family: var(--font-display);
} .breadcrumb {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.875rem;
color: var(--theme-color-light);
}
.breadcrumb a {
text-decoration: none;
transition: color 0.2s;
border: 1px solid var(--theme-color-light);
padding: 0 15px;
border-radius: 50px;
color: var(--theme-color-light);
}
.breadcrumb a:hover {
color: #1e293b;
}
.breadcrumb .current {
font-weight: 500;
border: 1px solid var(--theme-color);
padding: 0 15px;
border-radius: 50px;
color: var(--theme-color);
}
.solution-hero {
min-height: 70vh;
background: rgba(var(--theme-color-light-rgb), 0.2);
position: relative;
overflow: hidden;
display: flex;
align-items: center;
padding: 160px 0 30px;
}
.breadcrumb-wrapper .container {
padding: 0;
}
.breadcrumb-wrapper {
margin-bottom: 40px;
}
.cta1 {
background: var(--theme-color);
color: var(--theme-color-light);
display: flex;
flex-direction: row;
align-items: center;
gap: 10px;
line-height: 25px;
}
.cta2 {
border-color: var(--theme-color);
color: var(--theme-color);
display: flex;
align-items: center;
}
.note {
font-family: var(--font-body);
font-weight: 400;
font-size: 16px;
line-height: 18px;
letter-spacing: 0%;
display: flex;
flex-direction: row;
gap: 20px;
}
.solution-hero .solution-label {
display: inline-block;
animation: fadeInUp 0.6s ease-out;
}
.solution-hero h1 {
font-weight: 300;
font-size: 48px;
line-height: 52px;
letter-spacing: 0%;
}
.solution-hero .hero-content > *:nth-child(2) {font-family: var(--font-display);font-weight: 500;font-style: Medium;font-size: 18px;line-height: 100%;letter-spacing: 0%;}
.hero-image {
animation: fadeInUp 1s ease-out 0.6s both;
margin-right: -80px;
} .en-pratique .grid {
grid-template-columns: 50% 25% 1fr;
}
.offres-et-tarifs {
position: relative;
padding: 50px 30px;
margin-bottom: 30px;
font-family: var(--font-display);
font-weight: 400;
font-size: 18px;
line-height: 100%;
text-align: center;
}
.gauche {
padding-right: 115px;
}
.gauche-droite {
padding-top: 55px;
}
.en-pratique h2 {
font-family: var(--font-display);
font-weight: 300;
font-size: 38px;
line-height: 48px;
}
.pratique-card li {
font-family: Bricolage Grotesque;
font-weight: 600;
font-size: 18px;
line-height: 100%;
letter-spacing: 0%;
margin-bottom: 20px;
}
.offres-et-tarifs .btn {
background: var(--theme-color-light);
color: var(--theme-color);
margin-top: 40px;
}
.pratique-card ul, .encart-couleur ul {
list-style: none;
padding-left: 0;
}
.pratique-card ul li, .encart-couleur ul li {
display: flex;
align-items: flex-start; gap: 10px;
}
.encart-couleur ul li {
align-items: center;
}
.encart-couleur .btn {
background: var(--theme-color);
color: var(--theme-color-light);
}
.pratique-card ul li::before, .encart-couleur ul li:before {
content: "";
display: block;
width: 18px;
height: 18px;
flex-shrink: 0;
background-color: var(--theme-color-light); mask-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.0263 2.07714C14.1507 1.28571 11.4502 2.40815 9.11837 4.70365C7.5779 1.80195 5.36667 -0.119619 3.37281 0.00579378C0.563677 0.182029 -0.750404 4.35148 0.437593 9.31909C1.62559 14.2867 4.8661 18.1704 7.67528 17.9942C7.68982 17.9935 7.70409 17.9917 7.71824 17.9905C10.3101 18.1603 13.8129 15.6879 16.0731 11.9087C18.6608 7.58179 18.6394 3.17984 16.0258 2.07704Z' fill='%23000'/%3E%3C/svg%3E") !important;
mask-repeat: no-repeat;
mask-size: contain;
-webkit-mask-image: url(//www.bulle-studio.com/wp-content/themes/bulle-studio-theme-optimized/assets/css/...);
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: contain;
}
.encart-couleur ul li:before {
background-color: var(--theme-color);
width: 11px;
height: 11px;
} .service-card {
transition: transform 0.3s;
}
.service-card:hover {
transform: translateY(-5px);
}
.service-image {
transition: transform 0.3s;
}
.service-card:hover .service-image img {
transform: scale(1.05);
} .avantage-item {
animation: fadeInLeft 0.6s ease-out both;
}
.avantage-item:nth-child(1) { animation-delay: 0.1s; }
.avantage-item:nth-child(2) { animation-delay: 0.2s; }
.avantage-item:nth-child(3) { animation-delay: 0.3s; }
.dans_les_faits-image img {
height: 141px;
object-fit: cover;
width: 100%;
}
.avantages h3 {
font-weight: 600;
font-size: 18px;
line-height: 100%;
letter-spacing: 0%;
}
.avantages .grid p {
font-size: 16px;
line-height: 18px;
letter-spacing: 0%;
}
.dans_les_faits-card .content {
padding: 20px 10px;
}
.dans_les_faits-card {
box-shadow: 0px 2px 5px 0px #00000026;
border-radius: 5px;
}
/ .dans-les-faits-carousel-wrapper {
position: relative;
overflow: visible; padding: 0 60px; margin: 0 -60px; }
.dans-les-faits-carousel-container {
overflow: hidden; padding: 1rem 60px; margin: -1rem -60px; }
.dans-les-faits-carousel {
display: flex;
gap: 1rem;
transition: transform 0.5s ease;
}
.dans-les-faits-carousel .dans_les_faits-card {
flex: 0 0 calc(25% - 0.75rem); min-width: calc(25% - 0.75rem);
} .carousel-controls {
display: flex;
justify-content: center;
gap: 1rem;
margin-top: 2rem;
}
.carousel-prev,
.carousel-next {
border-radius: 50%;
width: 39px;
height: 39px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: all 0.3s;
background: #EFE7D4;
border: none;
}
.carousel-prev:hover,
.carousel-next:hover {
background: var(--theme-color);
color: #fff;
transform: scale(1.1);
} @media (max-width: 1200px) {
.dans-les-faits-carousel .dans_les_faits-card {
flex: 0 0 calc(33.333% - 0.67rem); min-width: calc(33.333% - 0.67rem);
}
}
@media (max-width: 768px) {
.dans-les-faits-carousel-wrapper {
padding: 0 40px;
margin: 0 -40px;
}
.dans-les-faits-carousel-container {
padding: 1rem 40px;
margin: -1rem -40px;
}
.dans-les-faits-carousel .dans_les_faits-card {
flex: 0 0 calc(50% - 0.5rem); min-width: calc(50% - 0.5rem);
}
.carousel-prev,
.carousel-next {
width: 40px;
height: 40px;
}
}
@media (max-width: 480px) {
.dans-les-faits-carousel .dans_les_faits-card {
flex: 0 0 100%; min-width: 100%;
}
.dans-les-faits-carousel-wrapper {
padding: 0 20px;
margin: 0 -20px;
}
.dans-les-faits-carousel-container {
padding: 1rem 20px;
margin: -1rem -20px;
}
} .encart-couleur .container {
background: rgba(var(--theme-color-light-rgb), 0.2);
color: var(--theme-color);
}
.encart-couleur h2 {
color: var(--theme-color);
}
section.encart-couleur .container {padding: 30px 50px;}
.encart-couleur p, .encart-couleur ul {
font-family: var(--font-body);
font-weight: 400;
font-size: 18px;
line-height: 22px;
letter-spacing: 0%;
} .cequilfaut .grid {
grid-template-columns: 1fr 488px;
}
.image-haut {margin-bottom: 20px;}
.cequilfaut h3.mb-md {
font-family: var(--font-display);
font-weight: 500;
font-size: 21px;
line-height: 100%;
letter-spacing: 0%;
}
.cequilfaut .gauche p {
font-weight: 400;
font-size: 16px;
line-height: 18px;
letter-spacing: 0%;
}
.item-line {
border-left: 2px solid var(--color-primary);
padding-left: 30px;
}
.cequilfaut .gauche {
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: flex-start;
}
.cequilfaut a {
margin-left: 30px;
}
.collaborer .gauche {
padding: 0 ;
}
.collaborer.grid {
grid-template-columns: 500px 1fr;
gap: 100px;
} .enquelquesmots .grid {grid-template-columns: 1fr 692px;}
.enquelquesmots .container {max-width: 1200px;}
.item-link {
background: rgba(var(--theme-color-light-rgb), 0.2);
padding: 30px 20px;
margin-bottom: 10px;
}
.item-link p {
color: var(--theme-color);
margin: 0;
font-family: var(--font-display);
font-weight: 600;
font-size: 18px;
line-height: 100%;
vertical-align: middle;
}
.item-link svg {
position: absolute;
right: 30px;
top: 25px;
}
.item-link {
position: relative;
}
.enquelquesmots .gauche {
padding-right: 40px;
} .carousel-offres {
position: relative;
} .carousel-tabs {
display: flex;
justify-content: center;
gap: 1rem;
}
.carousel-tab {
background: #fff;
border: 2px solid #e2e8f0;
border-radius: 12px;
padding: 0.875rem 2rem;
font-size: 1.125rem;
font-weight: 600;
color: #64748b;
cursor: pointer;
transition: all 0.3s;
}
.carousel-tab:hover {
border-color: #cbd5e1;
color: #475569;
}
.carousel-tab.active {
background: var(--theme-color-light);
color: var(--theme-color);
} .carousel-slides-wrapper {
position: relative;
min-height: 400px;
}
.carousel-slide {
display: none;
opacity: 0;
transition: opacity 0.5s ease;
}
.carousel-slide.active {
display: block;
opacity: 1;
animation: fadeIn 0.5s ease;
}
@keyframes fadeIn {
from {
opacity: 0;
transform: translateY(10px);
}
to {
opacity: 1;
transform: translateY(0);
}
} .slide-content {
background: #fff;
border-radius: 16px;
padding: 3rem;
display: flex;
gap: 3rem;
position: relative;
flex-direction: row;
justify-content: center;
}
.slide-content::before {
top: -6px;
left: -6px;
}
.slide-content::after {
top: -6px;
right: -6px;
}
.carousel-slides-wrapper::before {
left: 3rem;
}
.carousel-slides-wrapper::after {
right: 3rem;
} .slide-image {
flex: 0 0 45%;
border-radius: 12px;
overflow: hidden;
height: 300px;
max-width: 400px;
}
.slide-image img {
width: 100%;
height: auto;
display: block;
object-fit: cover;
} .slide-text {
flex: 1;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
padding-top: 20px;
padding-bottom: 20px;
max-width: 430px;
}
.slide-title {
font-weight: 500;
font-size: 24px;
line-height: 100%;
letter-spacing: 0%;
}
.slide-description {font-weight: 400;font-size: 18px;line-height: 100%;letter-spacing: 0%;}
.slide-btn {
display: inline-block;
background: transparent;
border: 2px solid var(--theme-color);
border-radius: 50px;
padding: 12px 18px;
font-size: 1rem;
font-weight: 600;
color: var(--theme-color);
text-decoration: none;
transition: all 0.3s;
margin-left: 0 !important;
}
.slide-btn:hover {
background: var(--theme-color-light);
color: var(--theme-color);
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(99, 102, 241, 0.3);
} .carousel-dots {
display: flex;
justify-content: center;
gap: 0.75rem;
}
.carousel-dots .dot {
width: 8px;
height: 8px;
background: #cbd5e1;
border-radius: 50%;
cursor: pointer;
transition: all 0.3s;
}
.carousel-dots .dot:hover {
background: #94a3b8;
}
.carousel-dots .dot.active {
background: #1e293b;
border-radius: 6px;
} @media (max-width: 1024px) {
.slide-content {
flex-direction: column;
padding: 2rem;
}
.slide-image {
flex: 0 0 auto;
width: 100%;
max-width: 500px;
}
.slide-title {
font-size: 1.75rem;
}
.slide-description {
font-size: 1rem;
}
}
@media (max-width: 768px) {
.carousel-tabs {
flex-wrap: wrap;
gap: 0.75rem;
}
.carousel-tab {
font-size: 1rem;
padding: 0.75rem 1.5rem;
}
.slide-content {
padding: 1.5rem;
}
.slide-title {
font-size: 1.5rem;
margin-bottom: 1rem;
}
.slide-description {
font-size: 0.9375rem;
margin-bottom: 1.5rem;
}
.carousel-slides-wrapper::before,
.carousel-slides-wrapper::after {
display: none;
}
}
@media (max-width: 480px) {
.carousel-tab {
flex: 1 1 auto;
min-width: 100px;
padding: 0.625rem 1rem;
font-size: 0.9375rem;
}
} .solution-item {
opacity: 0;
animation: fadeInUp 0.6s ease-out forwards;
}
.solution-item:nth-child(1) { animation-delay: 0.1s; }
.solution-item:nth-child(2) { animation-delay: 0.2s; }
.solution-item:nth-child(3) { animation-delay: 0.3s; }
.solutions .gauche {
padding: 0;
}
.solutions .grid {
align-items: center;
background-color: #FFFCF3;
justify-content: space-between;
grid-auto-flow: column;
padding: 30px 80px;
background-image: url(//www.bulle-studio.com/wp-content/uploads/2026/04/Vector-6.png);
background-repeat: no-repeat;
background-position: left center;
background-size: auto 100%;
}
.solution-accordion {
max-width: 100%;
}
.solution-accordion.colonne-flexible {
margin-bottom: 50px;
}
.solution-item {
border-bottom: 1px solid var(--color-text);
margin-bottom: 10px;
padding: 20px 10px 0 0;
}
.brand-content .droite {
display: flex;
flex-direction: column;
height: 100%;
justify-content: space-between;
}
.solution-question {
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0;
background: none;
border: none;
cursor: pointer;
font-size: 1.125rem;
font-weight: 500;
color: #1e293b;
text-align: left;
transition: color 0.2s;
} .solution-icon {
position: relative;
width: 36px;
height: 36px;
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: center;
}
.solution-icon .icon-plus {
display: block;
}
.solution-icon .icon-minus {
display: none;
} .solution-question.active .solution-icon .icon-plus {
display: none;
}
.solution-question.active .solution-icon .icon-minus {
display: block;
} .solution-icon svg {
transition: transform 0.3s ease;
position: absolute;
top: 0;
left: 0;
}
.solution-question:hover .solution-icon svg {
transform: scale(1.05);
}
.solution-answer {
max-height: 0;
overflow: hidden;
transition: max-height 0.3s ease;
}
.solution-answer p {
font-weight: 400;
font-size: 18px;
line-height: 22px;
letter-spacing: 0%;
}
.article-solution .container.flex {
gap: 120px;
max-width: 1200px;
}
.colonne-fixe {
width: 390px;
flex-shrink: 0; 
}
.colonne-flexible {
flex: 1; 
}
.solution h2 {
font-family: var(--font-display);
font-weight: 300;
font-size: 38px;
line-height: 48px;
}
.solution .nineties {
font-weight: 700;
}
.brand-content .grid {
background: #fff;
background-image: none;
padding: 0;
gap: 80px;
grid-template-columns: 500px 1fr;
}
.brand-content {
max-width: 1200px;
margin: auto;
}
.solution-answer {
max-height: 0;
overflow: hidden;
transition: max-height 0.3s ease;
}
.solution-icon .icon-minus { display: none; }
.solution-icon .icon-plus  { display: inline; }
.solution-question.active .icon-minus { display: inline; }
.solution-question.active .icon-plus  { display: none; } .offer-card {
border: 2px solid #e2e8f0;
transition: all 0.3s;
}
.offer-card:hover {
border-color: var(--theme-color, #FFC107);
transform: translateY(-5px);
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
} .portfolio-card {
transition: transform 0.3s;
border-radius: 5px;
box-shadow: 0px 2.7px 6.76px 0px #00000026;
}
.portfolio-card:hover {
transform: translateY(-5px);
}
.portfolio-image {
overflow: hidden;
height: 184px;
}
.portfolio-card:hover .portfolio-image img {
transform: scale(1.05);
}
.portfolio-image img {
transition: transform 0.3s;
border-radius: 0 0 5px 5px;
}
.portfolio-card p {
font-family: var(--font-body);
font-weight: 400;
font-size: 16px;
line-height: 18px;
letter-spacing: 0%;
margin: 20px;
}
.portfolio-card h3 {
font-family: var(--font-display);
font-weight: 600;
font-size: 24.33px;
line-height: 100%;
letter-spacing: 0%;
margin-bottom: 40px;
margin: 0 20px 40px;
}
.portfolio-category.mb-sm {
font-family: var(--font-display);
font-weight: 500;
font-size: 12px;
line-height: 14px;
letter-spacing: 0%;
border: 1px solid var(--color-text);
display: inline-block;
padding: 4px 10px;
border-radius: 50px;
margin: 20px;
} .tool-card {
border: 1px solid #e2e8f0;
transition: all 0.3s;
}
.tool-card:hover {
border-color: var(--theme-color, #FFC107);
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
} .cta-option {
transition: all 0.3s;
}
.cta-option:hover {
border-color: var(--theme-color, #FFC107);
background: rgba(255, 193, 7, 0.05);
transform: translateX(5px);
}
.cta-contact.solutions .grid {
background-image: url(//www.bulle-studio.com/wp-content/uploads/2026/04/Vector@2x.png);
position: relative;
gap: 80px;
grid-template-columns: 485px 1fr;
padding: 50px 50px;
}
img.travail-ensemble {
position: absolute;
max-width: 360px;
bottom: 0;
}
section.cta-contact.solutions.py-3xl {
position: relative;
}
.cta-contact h2 {
padding-left: 190px;
font-family: var(--font-display);
font-weight: 300;
font-style: Light;
font-size: 38px;
line-height: 48px;
letter-spacing: 0%;
}
.changer-dapproche .item-line {
background-color: #FFFCF3;
padding-top: 10px;
padding-bottom: 10px;
margin-bottom: 10px;
}
.changer-dapproche h3.mb-0 {
font-family: Bricolage Grotesque;
font-weight: 500;
font-style: Medium;
font-size: 21px;
line-height: 100%;
letter-spacing: 0%;
} .approche-card {
background: #FFFCF3;
padding: 30px;
position: relative;
display: flex;
flex-direction: column;
justify-content: space-between;
gap: 40px;
}
span.step {
font-family: var(--font-display);
font-weight: 300;
font-size: 48px;
line-height: 52px;
letter-spacing: 0%;
text-align: right;
vertical-align: middle;
position: absolute;
right: 30px;
top: 20px;
}
.approche-icon img {
width: 25px;
height: 25px;
object-fit: contain;
}
.approche-icon {
width: 51px;
height: 51px;
background: #fff;
display: flex;
justify-content: center;
align-items: center;
border-radius: 50px;
}
.approche-card h3.mb-sm {
font-weight: 600;
font-size: 18px;
line-height: 100%;
letter-spacing: 0%;
vertical-align: middle;
}
.approche-card p {
font-weight: 400;
font-size: 16px;
line-height: 18px;
letter-spacing: 0%;
vertical-align: middle;
}
.banniere {
background-color: #EFE7D4;
}
.banniere p.m-0 {
font-family: var(--font-display);
font-weight: 500;
font-size: 21px;
line-height: 100%;
letter-spacing: 0%;
} .faq-accordion {
max-width: 100%;
}
.faq-item {
border: 0.5px solid var(--color-text);
margin-bottom: 10px;
border-radius: 10px;
padding: 20px;
}
.faq-question {
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0;
background: none;
border: none;
cursor: pointer;
text-align: left;
transition: color 0.2s;
font-family: Bricolage Grotesque;
font-weight: 600;
font-size: 18px;
line-height: 100%;
letter-spacing: 0%;
}
.faq-question:hover {
color: var(--theme-color);
}
.faq-question.active {
color: var(--theme-color);
} .faq-icon {
position: relative;
width: 36px;
height: 36px;
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: center;
} .faq-icon .icon-plus {
display: block;
}
.faq-icon .icon-minus {
display: none;
} .faq-question.active .faq-icon .icon-plus {
display: none;
}
.faq-question.active .faq-icon .icon-minus {
display: block;
} .faq-icon svg {
transition: transform 0.3s ease;
position: absolute;
top: 0;
left: 0;
}
.faq-question:hover .faq-icon svg {
transform: scale(1.05);
} .faq-answer {
max-height: 0;
overflow: hidden;
transition: max-height 0.3s ease;
}
.faq-answer p {
font-family: var(--font-body);
font-weight: 400;
font-size: 16px;
line-height: 18px;
letter-spacing: 0%;
}
.article-faq .container.flex {
gap: 120px;
max-width: 1200px;
}
.colonne-fixe {
width: 390px;
flex-shrink: 0; 
}
.colonne-flexible {
flex: 1; 
}
.faq h2 {
font-family: var(--font-display);
font-weight: 300;
font-size: 38px;
line-height: 48px;
}
.faq .nineties {
font-weight: 700;
} .newsletter h2 {
padding: 0;
text-align: left;
}
.newsletter .droite p {
font-family: var(--font-display);
font-weight: 400;
font-size: 18px;
line-height: 100%;
letter-spacing: 0%;
text-align: left;
}
.newsletter-form .form-input {
transition: all 0.3s;
font-family: var(--font-body);
font-weight: 400;
font-size: 16px;
line-height: 18px;
letter-spacing: 0%;
vertical-align: middle;
}
.newsletter-form .form-input:focus {
border-color: var(--theme-color, #FFC107);
box-shadow: 0 0 0 3px rgba(255, 193, 7, 0.1);
outline: none;
}
.newsletter.cta-contact.solutions .grid {
background-image: url(//www.bulle-studio.com/wp-content/uploads/2026/04/Vector-10-1.png);
position: relative;
gap: 80px;
grid-template-columns: 485px 1fr;
padding: 50px 50px;
}
.newsletter .gauche {
display: flex;
align-items: flex-start;
gap: 30px;
}
section.portfolio.py-3xl {
display: none;
} @keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(30px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
@keyframes fadeInLeft {
from {
opacity: 0;
transform: translateX(-30px);
}
to {
opacity: 1;
transform: translateX(0);
}
} @media (max-width: 1024px) {
.solution-hero h1 {
font-size: 2.5rem;
}
.grid-4 {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 768px) {
.solution-hero h1 {
font-size: 2rem;
}
.grid-2,
.grid-3,
.grid-4 {
grid-template-columns: 1fr;
}
.hero-ctas {
flex-direction: column;
width: 100%;
}
.hero-ctas .btn { 
width: 100%;
}
.solution-item.flex-reverse {
flex-direction: column-reverse !important;
}
.newsletter-form {
flex-direction: column;
}
.newsletter-form .form-input {
max-width: 100%;
}
.gauche {
padding: 0;
}
.newsletter .gauche {
flex-direction: column;
}
.hero-image {
width: 100%;
}
.top-banner {
width: 100%;
position: inherit;
}
} .form-input::placeholder {
color: #2B2B2B !important;
opacity: 1 !important;
}