@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');*{font-family:"Poppins",sans-serif}
body{font-family:'Roboto',sans-serif;margin:0;padding:0;background:#f0f0f0 url('background-image.webp')no-repeat center center fixed;background-size:cover;color:#333;overflow-x:hidden;box-sizing:border-box}.landin-page{display:flex;flex-direction:row;background-color:rgba(255,235,59,0.8);padding:20px;align-items:center;justify-content:center;height:100vh;width:100vw;background-image:url('image/bg.webp');background-size:cover;background-position:center}.landin-image{width:400px;height:400px;background-image:url('image/kundlimatching.webp');background-size:cover;background-position:center;margin-right:40px}.landin-content{max-width:600px}.landin-title{font-size:48px;font-weight:bold;margin:0}.landin-text{font-size:20px;line-height:1.5;margin:20px 0}.landin-underline{width:100%;height:3px;background-color:black;margin-top:30px}
@media(max-width:768px){.landin-page{flex-direction:column;align-items:center;height:auto;padding:20px}.landin-image{width:300px;height:300px;margin-right:0;margin-bottom:20px}.landin-content{max-width:90%}.landin-title{font-size:36px}.landin-text{font-size:16px}.landin-underline{height:2px;margin-top:20px}}
@media(max-width:320px){.landin-page{flex-direction:column;align-items:center;height:auto;padding:10px}.landin-image{width:150px;height:150px;margin-right:0;margin-bottom:10px}.landin-content{max-width:90%}.landin-title{font-size:24px}.landin-text{font-size:12px}.landin-underline{height:1px;margin-top:10px}}
@media(min-width:768px)and(max-width:1024px){.landin-page{flex-direction:row;align-items:center;height:100vh;padding:20px}.landin-image{width:400px;height:400px;margin-right:40px;margin-bottom:0}.landin-content{max-width:600px}.landin-title{font-size:48px}.landin-text{font-size:20px}.landin-underline{height:3px;margin-top:30px}}
@media(max-width:200px){.landin-page{flex-direction:column;align-items:center;height:auto;padding:5px}.landin-image{width:80px;height:80px;margin-right:0;margin-bottom:5px;background-size:contain;background-repeat:no-repeat}.landin-content{max-width:90%}.landin-title{font-size:14px}.landin-text{font-size:8px}.landin-underline{height:1px;margin-top:5px}}.landing-container{text-align:center;width:100%;max-width:100vw;margin:0 auto;padding:50px 20px;background-color:rgba(255,255,255,0.9);min-height:80vh;box-sizing:border-box}
h1{font-size:1.50rem;color:#000000}.description{font-size:1.125rem;color:#000000;margin-bottom:40px}.description:not(:first-of-type){margin-left:auto;margin-right:auto;max-width:1000px;text-align:left;padding-left:20px;padding-right:20px}.divider-container{position:relative;width:70%;margin:35px auto}.divider{border:0;border-top:2px solid #666;opacity:0.5;margin:50px 0;width:100%;position:relative}.divider-image{position:absolute;top:-25px;left:47%;transform:translate(-50%,0);width:43px;height:auto;animation:spin 3s linear infinite}
@keyframes spin{0%{transform:translate(-50%,0)rotate(0deg)}
100%{transform:translate(-50%,0)rotate(360deg)}}.description:first-of-type{text-align:center}.form-section{padding:20px;background-color:rgb(255 255 255/0%);border-radius:10px;max-width:100vw;margin:0 auto;margin-bottom:6rem;box-sizing:border-box}.form-container{display:flex;flex-wrap:wrap;justify-content:space-between;gap:15px}.form-box{flex:1 1 !important;background-image:url('image/imagebg.webp');padding:15px;border-radius:8px;box-shadow:0 4px 8px rgba(0,0,0,0.1);box-sizing:border-box}.boy-details h2{background-image:url('image/bg.webp');background-size:cover;background-position:center;color:#fff;padding:10px;border-radius:5px}.girl-details h2{background-image:url('image/bg.webp');background-size:cover;background-position:center;color:#fff;padding:10px;border-radius:5px}.form-box h2{text-align:center;font-size:1.25rem;margin-bottom:15px;padding:10px;color:#000}.form-group{margin-bottom:10px}.form-group label{display:block;margin-bottom:5px;font-weight:500}.form-group input{width:100%;padding:8px;border-radius:4px;border:1px solid #ccc;font-size:1rem;box-sizing:border-box}.form-group input:focus{border-color:#ff8c00;outline:none}.time-group{display:flex;gap:10px}.time-group input{width:60px;padding:8px;border-radius:4px;border:1px solid #ccc;font-size:1rem;text-align:center}.time-group input::placeholder{color:#999}.submit-btn{width:100%;padding:10px;background-image:url('image/imagebg.webp');background-size:cover;background-position:center;color:#0000009b;font-size:1rem;font-weight:bold;border:none;border-radius:4px;cursor:pointer;margin-top:15px;text-align:center;box-shadow:0 2px 4px rgba(0,0,0,0.2);transition:all 0.3s ease}.submit-btn:hover{background-color:rgba(0,0,0,0.2);transform:scale(1.0);box-shadow:0 4px 8px rgba(0,0,0,0.3);color:#fff}.submit-btn:focus{outline:2px solid #e67e00}
@media(min-width:1024px){.landing-container{padding:40px 30px;min-height:55vh;align-content:center}
h1{font-size:1.25rem}.description{font-size:1rem;margin-bottom:30px}.form-section{padding:20px;max-width:800px;margin:0 auto;margin-bottom:6rem}.form-container{gap:10px}.form-box{flex:1 1 calc(50%-10px);padding:10px}.form-box h2{font-size:1.125rem}.form-group input{font-size:0.875rem;padding:6px}.time-group input{width:60px}.submit-btn{font-size:0.875rem;padding:8px}}
@media(max-width:768px){.landing-container{padding:15px 10px;margin-bottom:0;min-height:55vh}
h1{font-size:1.25rem}.description{font-size:0.875rem;margin-bottom:20px;margin-left:0;margin-right:0;text-align:center;padding-left:0;padding-right:0}.divider-container{width:60%;margin:30px auto}.divider{margin:30px 0}.divider-image{width:43px;top:-21px;left:39%;transform:translate(-50%,0);animation:spin 3s linear infinite}.form-box h2{font-size:1.125rem}.form-group input{font-size:0.875rem}.time-group input{width:40px}.submit-btn{font-size:0.625rem;padding:6px;width:auto}}.astro-section{background-image:url('image/bg.webp');background-size:cover;background-position:center;background-repeat:no-repeat;padding:50px;text-align:center;display:flex;justify-content:center;align-items:center;box-sizing:border-box;overflow:hidden}.astro-content{background-color:white;border-radius:10px;padding:20px;box-shadow:0 2px 10px rgba(0,0,0,0.1);display:flex;align-items:center;justify-content:space-between;max-width:1000px;width:100%;gap:20px;box-sizing:border-box;margin:0 auto;position:relative;min-height:120px}.astro-buttons{display:flex;flex-direction:column;gap:25px;position:absolute;right:-30px;top:50%;transform:translateY(-50%)}.astro-btn{background-color:#000000;color:#FFD700;border:none;border-radius:20px;padding:10px 15px;font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background-color 0.3s ease,box-shadow 0.3s ease}.astro-btn svg{margin-right:10px}.astro-btn:hover{background-color:#333333;box-shadow:0 4px 15px rgba(0,0,0,0.2)}
@media(max-width:768px){.astro-section{padding:15px}.astro-content{flex-direction:column;align-items:center;gap:10px;padding:15px;min-height:150px}.astro-buttons{position:static;right:auto;transform:none;flex-direction:column;gap:10px}.astro-btn{font-size:12px;padding:6px 10px}.astro-btn svg{width:20px;height:20px}}
@media(max-width:425px){.form-container{flex-direction:column;gap:15px}.form-box{flex:1 1 100%;padding:10px}.form-box h2{font-size:1rem;padding:10px}.form-group input{font-size:0.875rem}.time-group input{width:50px}.submit-btn{font-size:0.75rem;padding:8px;width:100%}}
@media(max-width:320px){.form-section{padding:5px;max-width:100vw;margin:0 auto;margin-bottom:2rem}.form-container{flex-direction:column;gap:5px}.form-box{flex:1 1 100%;padding:5px;box-shadow:none}.form-box h2{font-size:0.875rem;padding:5px}.form-group input{font-size:0.625rem;padding:4px}.time-group input{width:40px;font-size:0.625rem}.submit-btn{font-size:0.625rem;padding:4px;width:100%}}.info-section{position:relative;padding:20px;border-radius:8px;max-width:100%;margin:20px 0;text-align:center;overflow:hidden}.info-section::before{content:'';position:absolute;top:0;left:0;width:100%;height:200%;background-image:url('image/section-bg.webp');background-size:contain;background-position:center;background-repeat:no-repeat;animation:spin 20s linear infinite;z-index:-1;transform-origin:center}
@keyframes spin{0%{transform:rotate(0deg)}
100%{transform:rotate(360deg)}}.section-heading,.section-text,.paragraph{color:#000}.section-heading{font-size:1.25rem;margin-bottom:10px}.section-text{font-size:1rem;margin-bottom:20px}.paragraphs{margin:0 auto;max-width:1000px;padding-left:20px;padding-right:20px;text-align:left}.paragraph{font-size:0.75rem;line-height:1.6;margin-bottom:15px}.info-section{position:relative;padding:20px;border-radius:8px;max-width:100%;margin:20px 0;text-align:center;overflow:hidden}.hidden-content{display:none}.see-more-btn{background-image:linear-gradient(45deg,rgb(245,182,14),rgb(255,214,1));color:#000000;border:none;padding:10px 20px;border-radius:5px;cursor:pointer;margin-top:20px;display:inline-block;box-shadow:0 4px 6px rgba(0,0,0,0.2);transition:box-shadow 0.3s ease}.see-more-btn:hover{box-shadow:0 6px 8px rgba(0,0,0,0.3)}.see-more-btn-wrapper{display:flex;justify-content:center}
@media(max-width:767px){.hidden-content{display:none}.see-more-btn-wrapper{display:flex}}
@media(min-width:768px){.hidden-content{display:block}.see-more-btn-wrapper{display:none}}
@media(max-width:200px){.hidden-content{display:none}.see-more-btn-wrapper{display:flex}.see-more-btn{font-size:10px;padding:5px 10px;box-shadow:0 2px 4px rgba(0,0,0,0.2)}.paragraph{font-size:0.6rem;line-height:1.4}.info-section{padding:0px}}.content-section{position:relative;padding:20px;max-width:100%;margin:20px 0;text-align:center;overflow:hidden;background-image:url('image/imagebg.webp');background-size:cover;background-position:center;background-repeat:no-repeat}.text-paragraphs{margin:0 auto;max-width:1000px;padding-left:20px;padding-right:20px;text-align:left;padding-top:2rem}.text-block{font-size:0.75rem;line-height:1.6;margin-bottom:15px}.hidden-text{display:none}.toggle-content-btn{background-image:linear-gradient(45deg,rgb(245,182,14),rgb(255,214,1));color:#000000;border:none;padding:10px 20px;border-radius:5px;cursor:pointer;margin-top:20px;display:inline-block;box-shadow:0 4px 6px rgba(0,0,0,0.2);transition:box-shadow 0.3s ease}.toggle-content-btn:hover{box-shadow:0 6px 8px rgba(0,0,0,0.3)}.toggle-content-btn-wrapper{display:flex;justify-content:center}
@media(max-width:767px){.hidden-text{display:none}.toggle-content-btn-wrapper{display:flex}}
@media(min-width:768px){.hidden-text{display:block}.toggle-content-btn-wrapper{display:none}}
@media(max-width:200px){.hidden-text{display:none}.toggle-content-btn-wrapper{display:flex}.toggle-content-btn{font-size:10px;padding:5px 10px;box-shadow:0 2px 4px rgba(0,0,0,0.2)}.text-block{font-size:0.6rem;line-height:1.4}.content-section{padding:0px}}.slider-section{text-align:center;padding:70px 20px;background-color:#f9f9f9}.slider-heading{font-size:2em;margin-bottom:20px;color:#333}.slider-container{position:relative;width:100%;max-width:1000px;margin:auto;overflow:hidden}.slider{display:flex;transition:transform 0.5s ease-in-out}.slide{min-width:100%;box-sizing:border-box;padding:10px}.card{background-image:url('image/imagebg.webp');background-size:cover;background-position:center;background-repeat:no-repeat;padding:20px;text-align:center;border-radius:10px;box-shadow:0 4px 8px rgba(0,0,0,0.1);min-height:300px;display:flex;flex-direction:column;justify-content:space-between}.card-image{width:100px;height:100px;object-fit:contain;margin-bottom:10px;display:block;margin-left:auto;margin-right:auto}.card-title{font-size:1.2em;margin:10px 0;color:#333;word-wrap:break-word}.card-description{font-size:0.9em;color:#666;word-wrap:break-word;flex-grow:1;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}
button.prev,button.next{position:absolute;top:50%;transform:translateY(-50%);background-color:rgba(0,0,0,0.5);color:white;border:none;padding:10px;cursor:pointer;z-index:10}
button.prev{left:0}
button.next{right:0}
@media(min-width:769px){.slide{min-width:25%}}
@media(max-width:768px){.slide{min-width:50%}}
@media(max-width:480px){.slide{min-width:100%}}
@media(max-width:200px){.slider-container{padding:5px}.card{min-height:auto;padding:5px;background-size:cover}.card-image{width:50px;height:50px}.card-title{font-size:0.6em}.card-description{font-size:0.5em;-webkit-line-clamp:2}
button.prev,button.next{padding:3px;font-size:0.6em}}.analysis-section{text-align:center;padding:40px 20px;background-color:#f9f9f9}.analysis-heading{font-size:2em;margin-bottom:20px;color:#333}.analysis-slider-container{position:relative;width:100%;max-width:1000px;margin:auto;overflow:hidden;padding:0 10px}.analysis-slider{display:flex;flex-direction:row;transition:transform 0.5s ease-in-out}.analysis-slide{display:flex;flex:0 0 100%;box-sizing:border-box;overflow:hidden;padding:0 10px}.analysis-card{background-image:url('image/imagebg.webp   ');background-size:cover;background-position:center;background-repeat:no-repeat;padding:15px;text-align:center;border-radius:10px;box-shadow:0 4px 8px rgba(0,0,0,0.1);min-height:250px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;flex:1 0 auto;margin:5px;box-sizing:border-box}.analysis-card-image{width:100px;height:100px;padding:5px;object-fit:contain;margin:0 auto 8px auto;border-radius:50%;border:3px dotted #333}.analysis-card-title{font-size:1.2em;margin:10px 0;color:#333}.analysis-card-button{background-image:linear-gradient(45deg,rgb(245,182,14),rgb(255,214,1));color:#000000;border:none;padding:8px 16px;border-radius:5px;cursor:pointer;font-size:1em;transition:background-color 0.3s,box-shadow 0.3s;text-align:center;display:inline-block;margin-top:10px;box-shadow:0 4px 8px rgba(0,0,0,0.2)}.analysis-card-button:hover{box-shadow:0 6px 12px rgba(0,0,0,0.3)}.analysis-prev,.analysis-next{position:absolute;top:50%;transform:translateY(-50%);background-color:rgba(0,0,0,0.5);color:white;border:none;padding:10px;cursor:pointer;z-index:10}.analysis-prev{left:0}.analysis-next{right:0}
@media(min-width:769px){.analysis-slide{flex:0 0 100%}}
@media(max-width:768px){.analysis-card{flex:1 0 50%}}
@media(max-width:480px){.analysis-slide{flex:0 0 100%}.analysis-card{flex:1 0 100%;margin:5px}}