*  {
   margin: 0;
   padding: 0;
   box-sizing: border-box;
   font-family: 'Poppins', sans-serif;
}
 body  {
   background: #111111;
   color: white;
}
 .hero1  {
   display: flex;
   align-items: center;
   height: 100vh;
   padding: 60px 10%;
   background: url('https://images.unsplash.com/photo-1507089947368-19c1da9775ae') center/cover no-repeat;
   color: white;
}
 .hero1-content  {
   .hero1-content  {
     width: 80%;
     max-width: none;
     /* enlève la limite */ margin: 0 auto;
     /* centre horizontalement */ padding: 40px 30px;
     background-color: #4237371c;
     border-radius: 15px;
     animation: slideUp 1s ease;
  }
}
 .badge1  {
   display: flex;
   background: rgb(252, 252, 252);
   color: #0f0f0f;
   padding: 8px 16px;
   border-radius: 20px;
   font-size: 14px;
   margin-bottom: 15px;
   justify-content: center;
}
 .hero1 h1  {
   font-size: 52px;
   font-weight: 800;
   margin-bottom: 20px;
}
 .hero1 h1 span  {
   color: #056a7e;
}
 .hero1 p  {
   font-size: 20px;
   color: #070707;
   margin-bottom: 30px;
   font-weight: 400;
}
 .btn1-primary  {
   display: inline-block;
   background: #056a7e;
   padding: 14px 26px;
   border-radius: 6px;
   font-weight: 600;
   text-decoration: none;
   color: white;
   transition: 0.3s;
}
 .btn1-primary:hover  {
   background: #0077b6;
   transform: translateY(-3px);
}
 @keyframes slideUp  {
   from  {
     opacity: 0;
     transform: translateY(40px);
  }
   to  {
     opacity: 1;
     transform: translateY(0);
  }
}
 @media (max-width: 768px)  {
   .hero1  {
     padding: 40px 20px;
     text-align: center;
     justify-content: center;
  }
   .hero1-content  {
     max-width: 100%;
  }
   .hero1 h1  {
     font-size: 26px;
  }
   .badge1  {
     font-weight: 500;
     font-size: 11px;
  }
}
 /*********************/ .container2  {
   width: 90%;
   max-width: 1200px;
   margin: auto;
}
 .highlight2  {
   background: #16545f;
   padding: 2px 6px;
   border-radius: 4px;
}
 button  {
   cursor: pointer;
   padding: 12px 20px;
   border-radius: 30px;
   border: none;
   font-weight: 600;
}
 .btn2-primary  {
   background: #16545f;
   color: #ffffff;
}
 .btn2-outline  {
   border: 2px solid #16545f;
   background: transparent;
   color: #ffffff;
}
 .buttons2  {
   margin-top: 20px;
   display: flex;
   gap: 15px;
}
 .hero2 {
   padding: 80px 0;
}
 .hero2-content  {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 40px;
}
 .hero2-text  {
   flex: 1;
   color: #fafafa;
}
 .hero2-text h1  {
   font-size: 36px;
   margin-bottom: 20px;
}
 .hero2-text p  {
   margin-bottom: 20px;
   color: #f8f8f8;
}
 .hero2-image img  {
   width: 100%;
   max-width: 400px;
   border-radius: 15px;
}
 .about2  {
   padding: 80px 0;
   background: #fff;
}
 .about2-content  {
   display: flex;
   justify-content: space-between;
   align-items: center;
   gap: 40px;
}
 .about2-text  {
   flex: 1;
   color: #000;
}
 .about2-text h2  {
   font-size: 24px;
   margin-bottom: 20px;
}
 .about2-text ul  {
   margin: 15px 0;
   list-style: none;
}
 .about2-text li  {
   margin-bottom: 10px;
}
 .about2-shapes  {
   display: flex;
   flex-direction: column;
   gap: 15px;
}
 .about2-shapes img {
   width: 300px;
}
 .newsletter img {
   width: 140px;
   border-radius: 50px;
}
 .shape2  {
   width: 120px;
   height: 40px;
   background: #16545f;
   border-radius: 30px;
}
 .cta2 h2  {
   margin-bottom: 20px;
}
 @media(max-width: 768px)  {
   .hero2-content, .about2-content  {
     flex-direction: column;
     text-align: center;
  }
}
 .h3 {
   font-family:'Playfair Display', serif;
   font-size:38px;
   color:#ffffff;
   text-align: center;
}
 .container3 {
   display:flex;
   justify-content:space-between;
   gap:40px;
   margin: 2%;
}
 .card3 {
   background:#ffffff;
   padding:20px;
   border-radius:12px;
   flex:1;
   text-align:center;
   box-shadow:0 5px 20px rgba(0,0,0,0.05);
   transition:all 0.4s ease;
   transform:translateY(50px);
   color: #000;
}
 .card3:hover {
   transform:translateY(-10px) scale(1.03);
   box-shadow:0 15px 35px rgba(0,0,0,0.15);
}
 .card3 h2 {
   margin-bottom:15px;
   font-weight:600;
}
 .card3 p {
   font-weight:300;
   line-height:1.6;
   margin-bottom:10px;
}
 .icon3 {
   font-size:20px;
   margin-bottom:20px;
   transition:transform 0.4s ease;
}
 .card3:hover .icon {
   transform:rotate(10deg) scale(1.1);
}
 .show3 {
   animation:fadeUp 1s ease forwards;
}
 @keyframes fadeUp {
   to {
     transform:translateY(0);
     opacity:1;
  }
}
 @media(max-width:900px) {
   .container3 {
     flex-direction:column;
     text-align:center;
  }
}
 /**************/ .header44 {
   background:#eceae6;
   text-align:center;
   color: #1f7a3f;
   padding:10px 20px;
}
 .header44 h1 {
   margin:0;
   font-size:36px;
}
 .breadcrumb44 {
   margin-top:10px;
   font-size:14px;
   color:#777;
}
 .container44 {
   width:80%;
   margin:auto;
   padding:40px 0;
}
 h2 {
   font-size:30px;
   margin-bottom:10px;
}
 h3 {
   font-size:24px;
   margin-top:40px;
}
 p {
   line-height:1.7;
}
 ul {
   margin-top:10px;
}
 li {
   margin:10px 0;
}
 strong {
   color:#333;
}
 .divider44 {
   width:80px;
   height:2px;
   background:#6d2626;
   margin:40px auto;
}
 /****************/ h2  {
   text-align: center;
   font-family: 'Playfair Display', serif;
   font-size: 36px;
   margin-bottom: 50px;
}
.selection44{
    padding:60px 5%;
    background:#7b0034;
}
.selection44 h2{
    text-align:center;
    color:white;
    margin-top:40px;
    font-size:40px;
}
.cards44{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
    gap:30px;
}
.card44{
    position:relative;
    height:320px; /* AVANT 420px */
    border-radius:20px;
    overflow:hidden;
    cursor:pointer;
    transition:0.4s;
    box-shadow:0 10px 30px rgba(0,0,0,0.2);
}
.card44:hover{
    transform:translateY(-10px) scale(1.02);
}
.card44 img{
    width:100%;
    height:100%;
    object-fit:cover;
}
.overlay44{
    position:absolute;
    inset:0;
    background:linear-gradient(
        to top,
        rgba(0,0,0,0.9),
        rgba(0,0,0,0.2)
    );
}
.content44{
    position:absolute;
    bottom:25px;
    left:25px;
    right:25px;
    color:white;
    z-index:2;
}
.badge44{
    display:inline-block;
    background:#ffcc00;
    color:black;
    padding:6px 14px;
    border-radius:20px;
    font-size:14px;
    font-weight:bold;
    margin-bottom:15px;
}
.card44 h3{
    font-size:30px;
    margin-bottom:10px;
}
.info44{
    margin-top:5px;
    opacity:0.9;
}
.price44{
    margin:20px 0;
    font-size:28px;
    font-weight:bold;
    color:#ffcc70;
}
.openModal44,
.contactBtn44{
    border:none;
    padding:10px 28px;
    border-radius:30px;
    background:linear-gradient(45deg,#d63384,#7b0034);
    color:white;
    cursor:pointer;
    font-weight:bold;
    transition:0.3s;
}
.openModal44:hover,
.contactBtn44:hover{
    transform:translateY(-3px);
}
.modal44{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,0.85);
    display:none;
    justify-content:center;
    align-items:center;
    z-index:9999;
    padding:20px;
}
.modal44.active{
    display:flex;
}
.modal44-content{
    position:relative;
    width:100%;
    height:88vh;
    background:rgb(83, 2, 2);
    border-radius:20px;
    overflow:hidden;
    display:grid;
    grid-template-columns:1.1fr 1fr;
    box-shadow:0 20px 60px rgba(0,0,0,0.4);
    animation:zoom44 0.4s ease;
}
.slider44{
    position:relative;
    width:100%;
    height:100%;
    background:#000;
}
.slider44 img{
    width:100%;
    height:100%;
    object-fit:cover;
}
.modal44-text{
    padding:35px;
    overflow-y:auto;
    height:100%;
}
.modal44-text h2{
    font-size:35px;
    color:#ffffff;
    margin-bottom:25px;
}
.details44{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin-bottom:10px;
    color: #000;
}
.details44 p{
    background:#f5f5f5;
    padding:12px;
    border-radius:12px;
    font-size:13px;
}
.description44{
    line-height:1.8;
    color:#ffffff;
    margin-bottom:20px;
}
.features44{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:25px;
    color: #000;
}
.features44 span{
    background:#eee;
    padding:10px 15px;
    border-radius:20px;
    font-size:14px;
}
.close44{
    position:absolute;
    top:15px;
    right:25px;
    font-size:45px;
    color:white;
    cursor:pointer;
    z-index:10000;
}
.prev44,
.next44{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:50px;
    height:50px;
    border:none;
    border-radius:50%;
    background:rgba(0,0,0,0.5);
    color:white;
    font-size:22px;
    cursor:pointer;
    z-index:10;
}
.prev44{
    left:15px;
}
.next44{
    right:15px;
}
@media(max-width:992px){
    .modal44-content{
        width:95%;
        height:90vh;
        grid-template-columns:1fr;
    }
    .slider44{
        height:320px;
    }
}
@keyframes zoom44{
    from{  transform:scale(0.7);
        opacity:0; }
    to{ transform:scale(1);
        opacity:1;}}
@media(max-width:768px){
    .selection44 h2{  font-size:30px; }
    .modal44-content{    grid-template-columns:1fr; }
    .modal44-content img{     height:300px;}
    .modal44-text{  padding:25px; }
}




 button  {
   background: linear-gradient(45deg, #b52b5e, #7b0034);
   border: none;
   padding: 12px 25px;
   color: white;
   border-radius: 25px;
   cursor: pointer;
   transition: 0.3s;
}
 button:hover  {
   transform: translateY(-3px);
}
 .categories  {
   padding: 80px 5%;
   background: #7b0034;
}
 .category-grid  {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
   gap: 40px;
   text-align: center;
}
 .category img  {
   width: 150px;
   height: 150px;
   border-radius: 50%;
   object-fit: cover;
   margin-bottom: 15px;
   transition: 0.3s;
}
 .category img:hover  {
   transform: scale(1.1);
}
 .category p  {
   font-size: 14px;
}
 .inspiration  {
   background: #e9e9e9;
   padding: 60px 5%;
}
 .inspiration h2  {
   text-align: center;
   margin-bottom: 40px;
   font-family: 'Playfair Display', serif;
   color: #333;
}
 .inspiration-grid  {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   grid-auto-rows: 220px;
   gap: 0;
}
 .box  {
   position: relative;
   display: flex;
   align-items: center;
   justify-content: center;
   text-align: center;
   padding: 20px;
   overflow: hidden;
}
 .image  {
   background-size: cover;
   background-position: center;
}
 .dark::after  {
   content: "";
   position: absolute;
   inset: 0;
   background: rgba(0,0,0,0.5);
}
 .dark p  {
   position: relative;
   color: white;
   font-weight: 500;
}
 .text  {
   font-weight: 500;
   color: white;
   font-size: 14px;
   line-height: 1.6;
}
 .green  {
   background: linear-gradient(135deg, #2f9e7e, #3db48b);
}
 .small  {
   grid-column: span 1;
}
 .large  {
   grid-column: span 2;
}
 .large-vertical  {
   grid-row: span 2;
}
 .box:hover  {
   transform: scale(1.02);
   transition: 0.4s ease;
   z-index: 2;
}
 .hero22  {
   background: url("https://images.unsplash.com/photo-1581090700227-4c4f50e43b5f") center/cover no-repeat;
   margin-top: 70px;
   margin-bottom: -10px;
   height: 100px;
   display: flex;
   align-items: center;
   justify-content: center;
   position: relative;
}
 .overlay22  {
   text-align: center;
   color: white;
   background: rgba(0,0,0,0.4);
   width: 100%;
}
 .hero22 h1  {
   font-size: 30px;
   margin-bottom: 14px;
}
 .section22  {
   padding: 50px 20px 20px 20px;
}
 .section22 h2  {
   margin-bottom: 10px;
}
 .cards22  {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
   gap: 20px;
   color: #000;
}
 .card22  {
   background: white;
   padding: 20px;
   border-radius: 8px;
   transition: 0.3s;
   font-size: 14px;
}
 .card22:hover  {
   transform: translateY(-5px);
   box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}
 .card22 h3  {
   margin-bottom: 10px;
}
 .card22 a  {
   display: inline-block;
   margin-top: 20px;
   color: rgb(51, 4, 4);
   text-decoration: none;
   font-weight: bold;
   font-size: 14px;
}
 .image22-card  {
   background: #eee;
}
 /*******************/ .cards12-section  {
   padding: 50px;
   max-width: 1200px;
   margin: auto;
}
 .top12-titles  {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   text-align: center;
   margin-bottom: 20px;
}
 .top12-titles h2  {
   font-size: 20px;
   font-weight: 600;
}
 .cards12-container  {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
   gap: 25px;
}
 .card12  {
   background: white;
   border-radius: 8px;
   overflow: hidden;
   transition: 0.3s;
}
 .card12:hover  {
   transform: translateY(-6px);
   box-shadow: 0 8px 20px rgba(0,0,0,0.1);
}
 .card12 img  {
   width: 100%;
   height: 200px;
   object-fit: cover;
}
 .card12-content  {
   padding: 20px;
   color: #000;
}
 .card12-content h3  {
   font-size: 16px;
   margin-bottom: 15px;
}
 .card12-content ul  {
   list-style: none;
   margin-bottom: 15px;
}
 .card12-content li  {
   margin-bottom: 8px;
}
 .card12-content a  {
   text-decoration: none;
   color: #333;
   font-size: 14px;
}
 .card12-content a:hover  {
   text-decoration: underline;
}
 .highlight12-link  {
   color: #1f7a3f;
   font-weight: bold;
   display: inline-block;
   margin-top: 10px;
}
 .navbar01  {
   position: fixed;
   width: 100%;
   top: 0;
   background: white;
   padding: 20px 0;
   transition: 0.3s ease;
   z-index: 1000;
}
 .navbar01.scrolled  {
   padding: 12px 0;
   box-shadow: 0 5px 20px rgba(0,0,0,0.08);
}
 .container01  {
   width: 90%;
   max-width: 1200px;
   margin: auto;
   display: flex;
   align-items: center;
   justify-content: space-between;
}
 .logo01  {
   font-size: 22px;
   font-weight: 700;
   color: #111;
}
 .logo01 a {
   text-decoration: none;
}
 .logo01 span  {
   color: #ff4d00;
}
 .nav01-links ul  {
   display: flex;
   list-style: none;
   gap: 30px;
}
 .nav01-links a  {
   text-decoration: none;
   color: #333;
   font-weight: 500;
   position: relative;
   transition: 0.3s;
}
 .nav01-links a::after  {
   content: "";
   position: absolute;
   width: 0%;
   height: 2px;
   background: #ff4d00;
   bottom: -5px;
   left: 0;
   transition: 0.3s;
}
 .nav01-links a:hover::after  {
   width: 100%;
}
 .btn01-cta  {
   background: #ff4d00;
   color: white;
   padding: 10px 18px;
   border-radius: 25px;
   text-decoration: none;
   font-size: 14px;
   transition: 0.3s;
}
 .btn01-cta:hover  {
   background: #e84300;
}
 .dropdown01  {
   position: relative;
}
 .dropdown01-menu  {
   position: absolute;
   top: 35px;
   left: 0;
   background: white;
   padding: 15px;
   list-style: none;
   flex-direction: column;
   gap: 10px;
   border-radius: 8px;
   box-shadow: 0 10px 25px rgba(0,0,0,0.08);
   visibility: hidden;
}
 .dropdown01:hover .dropdown01-menu  {
   visibility: visible;
}
 .menu01-toggle  {
   display: none;
   font-size: 26px;
   cursor: pointer;
}
 .hero01  {
   height: 100vh;
   background: linear-gradient(135deg, #111, #444);
   color: white;
   display: flex;
   justify-content: center;
   align-items: center;
   margin-top: 80px;
}
 @media (max-width: 900px)  {
   .nav01-links  {
     position: fixed;
     right: -100%;
     top: 0;
     height: 100vh;
     background: white;
     width: 250px;
     padding-top: 80px;
     transition: 0.4s;
  }
   .nav01-links ul  {
     flex-direction: column;
     gap: 20px;
     padding-left: 20px;
  }
   .nav01-links.active  {
     right: 0;
  }
   .menu01-toggle  {
     display: block;
     filter: invert(100);
  }
   .btn01-cta  {
     display: none;
  }
}
 /********************/ .container33 {
   width:90%;
   max-width:1200px;
   margin:auto;
}
 .hero33 {
   margin-top: 2%;
   display:flex;
   align-items:center;
   justify-content:space-between;
   padding:80px 0;
}
 .hero33-text {
   width:55%;
}
 .hero33-text h1 {
   font-size:38px;
   margin-bottom:10px;
}
 .hero33-text h2 {
   font-size:24px;
   color:#666;
   margin-bottom:20px;
}
 .hero33-text p {
   margin-bottom:25px;
   line-height:1.6;
}
 .hero33-buttons button {
   padding:12px 22px;
   border:none;
   margin-right:10px;
   cursor:pointer;
   font-weight:bold;
   border-radius:4px;
}
 .btn33-primary {
   background:#f26722;
   color:white;
}
 .btn33-outline {
   border:2px solid #f26722;
   color:#f26722;
}
 .hero33-image {
   width:40%;
}
 .hero33-image img {
   width:100%;
   border-radius:6px;
}
 .services33 {
   background:#0a0a0a;
   padding:70px 0;
   text-align:center;
}
 .services33 h3 {
   margin-bottom:40px;
   font-size:26px;
}
 .cards33 {
   display:flex;
   gap:20px;
   flex-wrap:wrap;
   justify-content:center;
}
 .card33 {
   background:white;
   padding:25px;
   width:300px;
   border-radius:6px;
   box-shadow:0 4px 10px rgba(0,0,0,0.05);
   transition:0.3s;
   color: #000;
}
 .card33:hover {
   transform:translateY(-5px);
}
 .card33 h4 {
   margin-bottom:15px;
}
 .card33 ul {
   text-align:left;
}
 .card33 li {
   margin-bottom:8px;
}
 .why33 {
   padding:70px 0;
   background:white;
   color: #000;
}
 .why33 h3 {
   margin-bottom:25px;
   font-size:26px;
}
 .why33 ul {
   margin-bottom:30px;
}
 .why33 li {
   margin-bottom:10px;
}
 .cta33-btn {
   padding:14px 25px;
   background:#f26722;
   border:none;
   color:white;
   font-weight:bold;
   cursor:pointer;
   border-radius:4px;
}
 .popup33 {
   position:fixed;
   top:0;
   left:0;
   width:100%;
   height:100%;
   background:rgba(0,0,0,0.6);
   display:none;
   justify-content:center;
   align-items:center;
}
 .popup33-content {
   background:white;
   padding:30px;
   border-radius:6px;
   width:400px;
   text-align:center;
}
 .popup33 input {
   width:100%;
   padding:10px;
   margin:10px 0;
}
 .close33 {
   background:#f26722;
   color:white;
   border:none;
   padding:10px 15px;
   cursor:pointer;
}
 /**********/ .whatsapp-btn {
   position:fixed;
   bottom:25px;
   right:25px;
   width:60px;
   height:60px;
   background:#ffffff;
   color:white;
   font-size:30px;
   display:flex;
   align-items:center;
   justify-content:center;
   border-radius:50%;
   text-decoration:none;
   box-shadow:0 4px 10px rgba(0,0,0,0.3);
   z-index:1000;
   transition:0.3s;
}
 .whatsapp-btn img {
   width: 50px;
}
 .whatsapp-btn:hover {
   transform:scale(1.1);
}
 .partners-hero {
   padding:60px;
   text-align:center;
   background:rgba(255, 255, 255, 0.068);
}
 .partners-hero h2 {
   font-size:40px;
   margin-bottom:40px;
}
 .slider {
   overflow:hidden;
   position:relative;
   width:100%;
}
 .slide-track {
   display:flex;
   width:calc(250px * 12);
   animation:scroll 20s linear infinite;
}
 .slide {
   width:250px;
   display:flex;
   align-items:center;
   justify-content:center;
   padding:20px;
}
 .slide img {
   width:120px;
   opacity:0.7;
   transition:0.3s;
}
 .slide img:hover {
   opacity:1;
   transform:scale(1.1);
}
 @keyframes scroll {
   0% {
     transform:translateX(0);
  }
   100% {
     transform:translateX(-50%);
  }
}
 a {
   text-decoration: none;
}
 /************/ .hero07  {
   background: linear-gradient(135deg, #000, #222);
   padding: 20px 20px;
   text-align: center;
}
 .hero07 h1  {
   color: #f7c600;
   font-size: 3em;
}
 .hero07 p  {
   max-width: 700px;
   margin: 20px auto;
   font-size: 18px;
}
 .section07  {
   padding: 10px 20px;
   max-width: auto;
   margin: auto;
}
 .section07 h2  {
   color: #f7c600;
   margin-bottom: 10px;
}
 .section07 .h202 {
   color: #f7c600;
   margin: 20px 0px;
   font-size: 14px;
}
 .cards07  {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));
   gap: 10px;
}
 .card07  {
   background: #1c1c1c;
   padding: 20px;
   border-left: 4px solid #f7c600;
   cursor: pointer;
   transition: 0.3s;
   position: relative;
   border-radius: 8px;
}
 .card07:hover  {
   background: #000000;
}
 .content07  {
   max-height: 0;
   overflow: hidden;
   transition: 0.4s ease;
   margin-top: 0;
   font-size: 14px;
   color: #ccc;
}
 .card07.active .content07  {
   max-height: 600px;
   margin-top: 10px;
}
 .content07 .dv01 {
   display: flex;
   flex-wrap: nowrap;
}
 .dv04 {
   text-transform:inherit;
   color: #dddddd8f;
   font-size: 16px;
   margin: 0% 4% 7% 7%;
}
 .content07 .dv01 img {
   width: 85%;
   margin: 2%;
}
 ul  {
   padding-left: 20px;
}
 /******photo*****/ .hero  {
   height: 250px;
   position: relative;
   display: flex;
   align-items: center;
   justify-content: center;
}
 .hero::after  {
   content: "";
   position: absolute;
   inset: 0;
   background: rgba(0,0,0,0.6);
}
 .hero h1  {
   position: relative;
   color: white;
   font-size: 38px;
}
 .container  {
   width: 85%;
   margin: 10px auto;
}
 .section-label  {
   font-size: 14px;
   color: #777;
   margin-bottom: 5px;
}
 .section-title  {
   font-size: 26px;
   font-weight: 700;
   margin-bottom: 10px;
   position: relative;
}
 .section-title::before  {
   content: "";
   width: 50px;
   height: 3px;
   background: #d40000;
   position: absolute;
   left: 0;
   bottom: -6px;
}
 .section-desc  {
   font-size: 14px;
   color: #555;
   margin-bottom: 30px;
}
 .studio-grid  {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 20px;
}
 .studio-grid img  {
   width: 100%;
   height: 350px;
   object-fit: cover;
   border-radius: 6px;
   transition: 0.3s ease;
}
 .studio-grid img:hover  {
   transform: scale(1.05);
}
 .exterieur  {
   display: flex;
   gap: 40px;
   align-items: center;
}
 .exterieur img  {
   width: 350px;
   height: 450px;
   object-fit: cover;
   border-radius: 6px;
}
 .exterieur-text  {
   max-width: 500px;
}
 .exterieur-text h3  {
   font-size: 22px;
   margin-bottom: 15px;
}
 .exterieur-text p  {
   font-size: 14px;
   color: #555;
}
 @media (max-width: 900px)  {
   .studio-grid  {
     grid-template-columns: 1fr;
  }
   .exterieur  {
     flex-direction: column;
     text-align: center;
  }
}
 /************/ .contact12-section {
   padding:70px 0;
}
 .container12 {
   width:90%;
   max-width:1100px;
   margin:auto;
   display:flex;
   justify-content:space-between;
   gap:30px;
   flex-wrap:wrap;
   color:rgb(0, 0, 0);
}
 .contact12-card {
   background:white;
   padding:40px;
   flex:1;
   text-align:center;
   border-radius:6px;
   box-shadow:0 4px 10px rgba(0,0,0,0.05);
   transition:0.3s;
}
 .contact12-card:hover {
   transform:translateY(-6px);
   box-shadow:0 8px 20px rgba(0,0,0,0.1);
}
 .icon12 {
   width:70px;
   height:70px;
   background:#e56717;
   display:flex;
   align-items:center;
   justify-content:center;
   margin:auto;
   border-radius:50%;
   font-size:28px;
   margin-bottom:20px;
}
 .contact12-card h3 {
   margin-bottom:10px;
}
 .contact12-card p {
   color:#666;
}
 /*****form*******/ .form-section  {
   width: 70%;
   margin: 1% 15%;
   position: relative;
}
 .form-container  {
   background: rgb(8, 8, 8);
   padding: 20px;
   border-radius: 15px;
   margin: auto;
   box-shadow: 0 15px 40px rgba(0,0,0,0.15);
}
 .form-container h2  {
   text-align: center;
}
 .form-container p  {
   text-align: center;
   font-size: 14px;
   margin-bottom: 10px;
   color: #666;
}
 .input-group  {
   position: relative;
   margin-bottom: 10px;
}
 .input-group i  {
   position: absolute;
   left: 12px;
   top: 4px;
   color: #888;
}
 .input-group input, .input-group textarea  {
   width: 100%;
   padding: 12px;
   border-radius: 8px;
   border: 1px solid #ddd;
   font-size: 14px;
   transition: 0.3s;
}
 .input-group input:focus, .input-group textarea:focus  {
   border-color: #440707;
   box-shadow: 0 0 8px rgba(255,77,0,0.2);
   outline: none;
}
 .error  {
   color: red;
   font-size: 12px;
   margin-top: 5px;
   display: block;
}
 .btn-submit  {
   width: 100%;
   padding: 12px;
   background: #500707;
   border: none;
   border-radius: 25px;
   color: white;
   font-weight: 500;
   cursor: pointer;
   transition: 0.3s;
}
 .btn-submit:hover  {
   background: #25201d;
   transform: translateY(-2px);
}
 @media (max-width: 500px)  {
   .form-container  {
     padding: 25px;
  }
}
 /****************/ footer {
   background:#020202;
   padding:60px 8%;
}
 .footer-top {
   display:flex;
   justify-content:space-between;
   flex-wrap:wrap;
   gap:40px;
}
 .logo {
   font-size:28px;
   font-weight:600;
   margin-bottom:20px;
}
 .logo span {
   color:#4da6ff;
}
 .footer-col {
   flex:1;
   min-width:220px;
}
 .footer-col h3 {
   margin-bottom:20px;
   font-size:18px;
   font-weight:600;
   background-color: #ffffffe5;
   padding: 2% 6%;
   color: #000;
   text-align:left;
   border-radius: 50px;
}
 .footer-col ul {
   list-style:none;
}
 .footer-col ul li {
   margin-bottom:12px;
   font-size:14px;
   color:#ccc;
   cursor:pointer;
   transition:0.3s;
}
 .footer-col ul li:hover {
   color:#4da6ff;
}
 .contact p {
   margin-bottom:12px;
   font-size:14px;
   color:#ccc;
}
 .contact i {
   margin-right:10px;
   color:#4da6ff;
}
 .social {
   display:flex;
   gap:10px;
   margin-bottom:30px;
}
 .social a {
   width:35px;
   height:35px;
   background:#1c1c1c;
   display:flex;
   align-items:center;
   justify-content:center;
   border-radius:50%;
   color:#fff;
   transition:0.3s;
}
 .social a:hover {
   background:#4da6ff;
}
 .newsletter {
   position:relative;
   margin-top:15px;
}
 .newsletter input {
   width:100%;
   padding:12px 45px 12px 15px;
   border-radius:30px;
   border:none;
   outline:none;
   background:#1c1c1c;
   color:#fff;
}
 .newsletter button {
   position:absolute;
   right:5px;
   top:50%;
   transform:translateY(-50%);
   border:none;
   background:#4da6ff;
   width:35px;
   height:35px;
   border-radius:50%;
   color:#fff;
   cursor:pointer;
   transition:0.3s;
}
 .newsletter button:hover {
   background:#3a8de0;
}
 .footer-bottom {
   border-top:1px solid #ffffff;
   margin-top:50px;
   padding-top:20px;
   display:flex;
   justify-content:space-between;
   flex-wrap:wrap;
   font-size:13px;
   color:#aaa;
}
 .footer-links span {
   margin-left:20px;
   cursor:pointer;
   transition:0.3s;
}
 .footer-links span:hover {
   color:#4da6ff;
}
 @media(max-width:900px) {
   .footer-top {
     flex-direction:column;
  }
}