 /* Reset și variabile CSS */
 @font-face {
     font-family: 'AKONY';
     src: url('font/AKONY.woff2') format('woff2'),
         url('font/AKONY.woff') format('woff');
     font-weight: normal;
     font-style: normal;
     font-display: swap;

 }


 /* --------------------------------------------------------------------------------------ROOT + BODY------------------------------------------ */


 :root {
     /* 🌈 Culori */
     --color-bg: #121212;
     --color-secondary: #e9e9e9;
     --color-accent: #73bf44;
     --color-text: #111111;
     --color-muted: #444444;

     /* ✍️ Fonturi */
     --font-heading: 'Ankony', serif;
     --font-body: 'Inter', sans-serif;

     /* 🔠 Dimensiuni text (responsive cu clamp) */
     --fs-h1: clamp(2.5rem, 5vw, 4rem);
     --fs-h2: clamp(1.75rem, 4vw, 3rem);
     --fs-h3: clamp(1.5rem, 3vw, 2.25rem);
     --fs-body: clamp(1rem, 1.2vw, 1.125rem);
     --fs-small: clamp(0.875rem, 1vw, 1rem);

     /* 📏 Border */


     /* 🖋️ Grosime text */
     --fw-light: 300;
     --fw-normal: 400;
     --fw-medium: 500;
     --fw-bold: 700;
 }




 .intro-servicii {
     background-color: var(--color-bg);
     background-image:
         linear-gradient(to bottom,
             rgba(255, 255, 255, 0.05) 1px,
             transparent 1px);
     background-size: 100% 60px;
     /* distanța dintre linii */

     background-image:
         linear-gradient(to bottom, rgba(255, 255, 255, 0.05) 1px, transparent 1px),
         linear-gradient(to right, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
     background-size: 100% 40px, 40px 100%;
     color: var(--color-secondary);
     font-family: var(--font-body);
     padding: 8rem 4rem 4rem 4rem;
     text-align: center;
     box-sizing: border-box;
     height: auto;
 }


 .container-intro {
     max-width: 1200px;
     margin: 0 auto;
     display: flex;
     flex-direction: column;
     gap: 2rem;
     box-sizing: border-box;
     height: auto;

 }

 .container-intro h1 {
     font-size: var(--fs-h1);
     font-weight: var(--fw-bold);
     line-height: 110%;
 }


 .highlight {
     text-decoration: underline;
     /* subliniază cuvintele */
     text-decoration-color: var(--color-accent);
     /* poți alege o culoare diferită */
     text-decoration-thickness: 3px;
     /* grosimea liniei */
     text-underline-offset: 5px;
     /* distanța de text */
     font-weight: 600;
     /* opțional, un pic mai bold pentru evidențiere */
     font-style: italic;
     color: #939393;
 }


 .container-intro .intro-descriere {

     line-height: 150%;
     color: #939393;
     flex-direction: column;
     display: flex;
     gap: 1rem;
     text-align: start;

 }

 .cta-intro {
     font-size: 1.4rem;
     font-weight: 700;
     text-align: center;
     max-width: 600px;
     margin: 30px auto;
     font-family: 'Poppins', sans-serif;
     background: linear-gradient(90deg, #73bf44, #147e71, #26640b, #33c9dd);
     background-size: 300% 300%;
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     animation: gradientMove 5s ease infinite;
 }

 @keyframes gradientMove {
     0% {
         background-position: 0% 50%;
     }

     50% {
         background-position: 100% 50%;
     }

     100% {
         background-position: 0% 50%;
     }
 }

 /* opțional: pulse pe tot textul */
 .cta-intro {
     display: inline-block;
     animation: gradientMove 5s ease infinite, pulse 2s ease-in-out infinite;
 }

 @keyframes pulse {

     0%,
     100% {
         transform: scale(1);
     }

     50% {
         transform: scale(1.03);
     }
 }


 @media (max-width: 768px) {
     .intro-servicii {
         padding: 7rem 2rem 2rem 2rem;
     }
 }


 .container-serv {
     height: auto;
     background-color: var(--color-secondary);
     font-family: var(--font-body);
     box-sizing: border-box;

 }

 .first-part {
     padding: 4rem 4rem 4rem 4rem;
     height: auto;
     display: flex;
     flex-direction: column;
     box-sizing: border-box;
     gap: 1rem;
 }



 .navbar {
     z-index: 500;
 }

 .two-part {
     display: flex;
     flex-direction: column;
     gap: 2rem;
     height: auto;
     background: var(--color-bg);
     padding: 4rem 4rem 4rem 4rem;
 }

 .two-part h2 {
     font-size: var(--fs-h1);
     color: var(--color-accent);
     line-height: 110%;
 }

 .two-part .continut-container {
     display: flex;
     flex-direction: column;
     gap: 2rem;
 }

 .two-part .continut-container .continut-raspuns1,
 .continut-raspuns2,
 .continut-raspuns3,
 .continut-raspuns4,
 .continut-raspuns5 {
     width: 40%;
     height: auto;
     color: var(--color-secondary);
     border-bottom: 1px solid var(--color-secondary);
 }

 .continut-container>div:nth-child(1) {
     align-self: flex-start;
     /* stanga */
     text-align: left;
 }

 .continut-container>div:nth-child(2) {
     align-self: center;
     /* mijloc */
     text-align: start;
 }

 .continut-container>div:nth-child(3) {
     align-self: end;
     /* mijloc */
     text-align: start;
 }

 .continut-container>div:nth-child(4) {
     align-self: center;
     /* mijloc */
     text-align: start;
 }

 .continut-container>div:nth-child(5) {
     align-self: start;
     /* mijloc */
     text-align: start;
 }


 /* ===== Desktop (default) ===== */
 .two-part .continut-container .continut-raspuns1,
 .continut-raspuns2,
 .continut-raspuns3,
 .continut-raspuns4,
 .continut-raspuns5 {
     width: 40%;
     height: auto;
     display: flex;
     flex-direction: column;
     gap: 1rem;
 }

 section {
     border-bottom: 1px solid var(--color-muted);
 }

 .pnc {
     color: var(--color-accent);
     font-weight: var(--fw-light);
 }

 .price-tag {
     display: inline-flex;
     justify-content: center;
     align-items: center;
     padding: 12px 24px;
     border: 1px solid #6c6c6c;
     border-radius: 50px;
     width: fit-content;

     /* Background gradient animat */
     background: linear-gradient(90deg, #73bf44, #147e71, #26640b, #33c9dd);
     background-size: 300% 300%;
     animation: gradientMove 5s ease infinite, pulse 2s ease-in-out infinite;
 }

 .price-tag span {
     font-family: var(--font-body);
     font-weight: var(--fw-light);
     font-size: var(--fs-body);
     color: var(--color-secondary);
     /* aici pui ce culoare vrei pentru text */
 }

 @keyframes gradientMove {
     0% {
         background-position: 0% 50%;
     }

     50% {
         background-position: 100% 50%;
     }

     100% {
         background-position: 0% 50%;
     }
 }

 @keyframes pulse {

     0%,
     100% {
         transform: scale(1);
     }

     50% {
         transform: scale(1.05);
     }
 }


 .titlu-icon {
     display: flex;
     flex-direction: row;
     justify-content: start;
     align-items: end;
     gap: 1rem;
 }

 .continut-container i {
     font-size: 1.8em;
     color: var(--color-accent);
 }


 .logo-carousel::before {
     left: 0;
     background: none;
 }

 .logo-carousel::after {
     right: 0;
     background: none;
 }

 .logo-lines {
     background: var(--color-secondary);
 }













 /* ===== Mobile Responsive ===== */
 @media (max-width: 768px) {


     .logo-lines {
         gap: 20px;
         padding: 20px 0px 20px 0px;
     }

     .titlu-icon {
         display: flex;
         flex-direction: row;
         justify-content: start;
         align-items: end;
         gap: 1rem;
     }

     .continut-container i {
         font-size: 1.8em;
         color: var(--color-accent);
     }

     .price-tag {
         display: inline-flex;
         justify-content: center;
         align-items: center;
         padding: 12px 24px;
         border: 1px solid #6c6c6c;
         border-radius: 50px;
         width: fit-content;

         /* Background gradient animat */
         background: linear-gradient(90deg, #73bf44, #147e71, #26640b, #33c9dd);
         background-size: 300% 300%;
         animation: gradientMove 5s ease infinite, pulse 2s ease-in-out infinite;
     }

     .price-tag span {
         font-family: var(--font-body);
         font-weight: var(--fw-light);
         font-size: var(--fs-body);
         color: var(--color-secondary);
         /* aici pui ce culoare vrei pentru text */
     }

     @keyframes gradientMove {
         0% {
             background-position: 0% 50%;
         }

         50% {
             background-position: 100% 50%;
         }

         100% {
             background-position: 0% 50%;
         }
     }

     @keyframes pulse {

         0%,
         100% {
             transform: scale(1);
         }

         50% {
             transform: scale(1.05);
         }
     }



     .first-part {
         padding: 2rem 2rem 2rem 2rem;
         height: auto;
         flex-direction: column;
         justify-content: center;
         height: auto;
         gap: 2rem;
     }


     /* ===== Desktop (default) ===== */
     .two-part .continut-container .continut-raspuns1,
     .continut-raspuns2,
     .continut-raspuns3,
     .continut-raspuns4,
     .continut-raspuns5 {
         color: var(--color-bg);
         line-height: 150%;
         display: flex;
         flex-direction: column;
         gap: 1rem;
     }



     .first-part .right-part {
         flex-direction: row;
         gap: 2rem;
         overflow-x: auto;
         scroll-snap-type: x mandatory;
         -webkit-overflow-scrolling: touch;

     }

     .first-part .right-part .raspuns {
         flex: 0 0 80%;
         /* fiecare card ocupă 80% din lățimea viewport-ului */
         min-width: 250px;
         /* lățime minimă */

         padding: 1rem;
         background: linear-gradient(135deg, #e5e5e5 0%, #f6f6f6 15%, #e0e0e0 25%, #f5f5f5 45%, #dcdcdc 70%, #f2f2f2 100%);
         border-radius: 20px;
         box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4);
         z-index: 10;
         box-sizing: border-box;
         border: 1px solid rgb(194, 194, 194);
         scroll-snap-align: start;
         /* fiecare card "snap" la început */
         height: 100%;
     }

     .right-part::-webkit-scrollbar {
         display: none;
         /* pentru Chrome, Safari și Opera */
     }




     .two-part {
         padding: 2rem 2rem 2rem 2rem;
         border-bottom: 1px solid var(--color-secondary);
         background-color: var(--color-secondary);
     }

     .two-part h2 {
         font-size: 2.4rem;
         text-align: start;
         color: var(--color-bg);
     }



     .two-part .continut-container>div {
         width: 100% !important;
         align-self: center !important;
         text-align: start !important;
     }


 }

 .faq-section {
     width: 80%;


 }

 .faq-item {
     border-bottom: 1px solid var(--color-muted);
     background-color: none;
 }

 .faq-item:hover {
     border-bottom: 1px solid var(--color-accent);
 }

 .faq-question {
     padding: 15px;
     cursor: pointer;

     background: none;
     font-family: var(--font-body);
     font-weight: var(--fw-bold);
     font-size: var(--fs-h4);
     line-height: 150%;
 }


 .faq-question:hover {
     color: var(--color-accent);

 }

 .faq-answer {
     max-height: 0;
     overflow: hidden;
     transition: max-height 0.3s ease;
     padding: 0 15px;
     background: none;
     font-family: var(--font-body);
     font-weight: var(--fw-light);
     font-size: var(--fs-body);
     color: var(--color-muted);
     line-height: 150%;
 }



 .faq-question:after {
     content: '\02795';
     /* Unicode character for "plus" sign (+) */
     font-size: 13px;
     color: var(--color-muted);
     float: right;
     margin-left: 5px;
 }




 /* ===== Mobile: scroll horizontal ===== */
 @media (max-width: 768px) {

     .faq-section {
         width: 100%;
     }




     .two-part .continut-container {
         display: flex;
         /* le pune pe un rand */

         /* scroll pe orizontala */
         gap: 1.5rem;
         scroll-snap-type: x mandatory;
         padding-bottom: 1rem;
     }

     .two-part .continut-container>div {
         min-width: 80%;
         /* fiecare card ocupa ~80% din ecran */
         flex: 0 0 85%;
         /* nu se micsoreaza */
         scroll-snap-align: start;
         /* fiecare se lipeste cand dai scroll */
         background: linear-gradient(to top, #dcdcdc 0%, #e9e9e9 100%);

         /* contrast optional */
         border-radius: 12px;
         padding: 1rem;
         box-sizing: border-box;


     }

     /* Elimin alinierea diferita pentru mobile */
     .continut-container>div {
         align-self: auto !important;
         text-align: left !important;
     }

     /* Ascund scrollbar */
     .two-part .continut-container::-webkit-scrollbar {
         display: none;
     }

     .two-part .continut-container {
         -ms-overflow-style: none;
         /* IE si Edge */
         scrollbar-width: none;
         /* Firefox */
     }


 }