* {box-sizing: border-box;margin: 0;padding: 0;font-family: 'Noto Sans JP', sans-serif;}html, body {height: 100%;background-color: #f0f5e9;font-family: 'Noto Sans JP', sans-serif;line-height: 1.6;color: #4a4a4a;}.container {min-height: 100%;display: flex;flex-direction: column;}.content {flex: 1;padding: 20px;}.navbar {width: 100%;margin: auto;padding: 0.8rem 2rem;display: flex;align-items: center;justify-content: space-between;height: auto;background-color: rgba(255, 255, 255, 0.9);box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);backdrop-filter: saturate(180%) blur(20px);position: fixed;top: 0;z-index: 1000;transition: background-color 0.5s ease;}.logo {width: 150px;height: auto;display: block;margin: 5px auto;}.navbar ul {display: flex;list-style: none;}.navbar ul li {list-style: none;display: inline-block;margin: 0 20px;position: relative;}.navbar ul li a {text-decoration: none;color: #5a7155;text-transform: none;font-weight: 500;font-size: 14px;}.navbar ul li::after {content: '';height: 1.55px;width: 0;background: #5a7155;position: absolute;left: 0;bottom: -10px;transition: 0.5s;}.navbar ul li:hover::after {width: 100%;}.menu-icon {display: none;cursor: pointer;margin-left: auto;z-index: 1100;}.menu-icon span {display: block;width: 25px;height: 3px;background-color: #5a7155;margin: 5px 0;transition: 0.4s;}.menu-icon.active span:nth-child(1) {transform: rotate(-45deg) translate(-5px, 6px);}.menu-icon.active span:nth-child(2) {opacity: 0;}.menu-icon.active span:nth-child(3) {transform: rotate(45deg) translate(-5px, -6px);}@keyframes fadeIn {from {opacity: 0;transform: translateY(20px);}to {opacity: 1;transform: translateY(0);}}.animate-fade-in-up {animation: fadeInUp 0.6s ease-out;}.service, .work-with-us-box, .contact form {opacity: 0;transform: translateY(20px);transition: opacity 0.6s ease-out, transform 0.6s ease-out;}.service.in-view, .work-with-us-box.in-view, .contact form.in-view {opacity: 1;transform: translateY(0);}.hero {height: 740px;background-image: url("../media/home.webp");background-size: cover;background-position: center;background-attachment: fixed;display: flex;flex-direction: column;justify-content: center;align-items: left;padding: 0 100px;line-height: 1.6;position: relative;box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);}.hero::before {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.3);z-index: 1;}.hero h1, .hero p, .button {position: relative;z-index: 2;animation: fadeIn 1s ease-out;}.hero h1 {color: rgb(255, 255, 255);font-size: 48px;margin: 20px 0;font-weight: 700;}.hero p {margin: 20px 0;color: rgb(255, 255, 255);font-size: 16px;line-height: 1.6;font-weight: bold;}.button, .button_form, .back-to-top-btn {background-color: #5a7155;color: #f0f5e9;border: none;transition-property: background-color, transform, box-shadow;transition-duration: 0.3s;transition-timing-function: ease;}.button {width: 200px;margin-top: 30px;padding: 15px 25px;border-radius: 25px;font-size: 14px;cursor: pointer;font-weight: 500;}.button_form {width: 200px;margin-top: 30px;padding: 15px 25px;border-radius: 25px;font-size: 14px;cursor: pointer;font-weight: 500;margin-bottom: 20px;}.button:hover, .button_form:hover, .back-to-top-btn:hover {background-color: #6d8566;transform: scale(1.05);box-shadow: 0 4px 15px rgba(109, 133, 102, 0.2);}.back-to-top-btn {position: fixed;bottom: 20px;right: 20px;background-color: #5a7155;color: white;border: none;padding: 25px 30px;cursor: pointer;border-radius: 5px;opacity: 0;pointer-events: none;transition: opacity 0.3s ease, visibility 0.3s ease;}.about {margin-top: 40px;padding: 30px 100px;height: 400px;}.about h2 {padding-bottom: 60px;font-size: 32px;color: #5a7155;margin-bottom: 20px;letter-spacing: 1.5px;}.about p {font-size: 16px;color: #4a4a4a;margin-bottom: 16px;line-height: 1.6;}.services {margin: 40px;display: grid;grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));gap: 30px;justify-content: center;padding: 10px;}.services h2 {font-size: 32px;color: #5a7155;letter-spacing: 1.5px;text-align: center;}.service {background-color: #ffffff;width: 100%;height: 300px;border-radius: 10px;display: flex;flex-direction: column;justify-content: center;align-items: center;padding: 60px;box-shadow: 0 5px 15px rgba(0,0,0,0.1);transition: all 0.3s ease;}.service:hover {transform: translateY(-5px);box-shadow: 0 15px 30px rgba(0,0,0,0.2);}.service img {width: 70px;height: 70px;margin-bottom: 20px;filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));transition: transform 0.3s ease, filter 0.3s ease;}.service img:hover {transform: scale(1.1);filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.3));}.service h3 {margin: 10px 0;font-size: 18px;color: #4a4a4a;text-align: center;}.service p {margin: 10px 0;font-size: 16px;color: #666;line-height: 1.6;text-align: center;}.work-with-us {display: grid;grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));gap: 20px;align-items: center;justify-content: space-around;margin: 16px;}.work-with-us-box {height: 400px;background-color: #ffffff;padding: 40px;border-radius: 16px;margin: 20px 0;display: flex;flex-direction: column;align-items: center;justify-content: center;max-width: 900px;margin: auto;box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.05);}.work-with-us-box p {font-family: 'Noto Sans JP', sans-serif;color: #4a4a4a;line-height: 1.8;text-align: center;}.stats {position: relative;background-image: url("../media/laptops-dt.webp"), linear-gradient(90deg, #5a7155, #3a5a40);background-size: cover;background-position: center;background-attachment: fixed;background-blend-mode: multiply;padding: 60px 0;text-align: center;margin-bottom: 40px;overflow: hidden;}.stats::before {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(90, 113, 85, 0.85);z-index: 1;}.stats .container {position: relative;z-index: 2;display: flex;justify-content: space-around;flex-wrap: wrap;}.stat-item {margin: 20px;}.stat-number {font-size: 36px;font-weight: bold;color: #ffffff;}.stat-item p {font-size: 14px;color: #ffffff;}.pricing {margin-top: 20px;padding: 30px 5%;height: auto;position: relative;}.pricing h2 {padding-bottom: 40px;font-size: clamp(28px, 3vw, 38px);color: #5a7155;margin-bottom: 20px;letter-spacing: 1.5px;text-align: center;}.pricing-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));gap: 2.5rem;max-width: 1200px;margin: 0 auto;align-items: stretch;}.price-card {background: linear-gradient(145deg, #ffffff 0%, #f5faf4 100%);border-radius: 15px;border: 2px solid #e9f5e7;box-shadow: 0 10px 30px rgba(90, 113, 85, 0.1);transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);padding: 2.5rem;min-height: 450px;position: relative;display: flex;flex-direction: column;justify-content: space-between;}.price-card:hover {transform: translateY(-10px);box-shadow: 0 15px 40px rgba(90, 113, 85, 0.2);}.price-card > * {flex-shrink: 0;}.price {font-size: 2.75rem !important;font-weight: 800;color: #4a6545;text-shadow: 0 2px 4px rgba(90, 113, 85, 0.1);margin: 1.5rem 0;line-height: 1;}.pages {text-align: center;font-size: 1.1rem;color: #6b8765;margin-bottom: 2rem;}.features {flex-grow: 1;margin-bottom: 2rem;padding: 0 1rem;}.features li {padding: 0.75rem 0;color: #4a6545;font-weight: 500;display: flex;align-items: center;}.features li:before {content: "✔";color: #8da889;font-weight: 700;margin-right: 0.75rem;transform: rotate(0deg);transition: transform 0.2s ease;}.features li:hover:before {transform: translateX(3px);}.price-card .button {background: linear-gradient(45deg, #5a7155 0%, #8da889 100%);color: white;border: none;transition: all 0.3s ease;padding: 1.2rem 2rem;width: calc(100% - 4rem);margin: 0 auto;position: relative;display: block;}.price-card .button::after {content: '';position: absolute;top: 0;left: -100%;width: 50%;height: 100%;background: linear-gradient( to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.2) 50%, rgba(255,255,255,0) 100% );transform: skewX(-25deg);transition: left 0.75s ease;}.price-card .button:hover::after {left: 150%;}@keyframes shine {0% {left: -50% }100% {left: 150% }}@media (max-width: 768px) {.pricing {padding: 30px 5%;}.price-card {min-height: auto;padding: 2rem;}.features {padding: 0;}}.contact {margin-top: 20px;padding: 30px 100px;height: 880px;margin-bottom: 40px;}.contact h2 {padding-bottom: 40px;font-size: 32px;color: #5a7155;margin-bottom: 20px;letter-spacing: 1.5px;}.contact p {font-size: 16px;color: #4a4a4a;padding-bottom: 60px;}form {margin-top: 20px;max-width: 600px;margin: 0px auto;}form label {display: block;margin-bottom: 10px;font-weight: 500;font-size: 14px;}form input, form textarea {margin-bottom: 20px;width: 100%;padding: 8px 0;border: none;border-bottom: 1px solid #5a7155;border-radius: 0;font-size: 16px;background: transparent;transition: none;}form input:focus, form textarea:focus {outline: none;border-bottom-color: #5a7155;}form textarea {resize: none;}.footer {background-color: #ffffff;min-height: auto;padding: 40px 0 60px;display: flex;flex-wrap: wrap;justify-content: space-between;width: 100%;position: relative;}.footer ul {list-style: none;}.row {display: flex;flex-wrap: wrap;}.footer-col {width: 50%;padding: 0 75px;}.footer-col h4 {margin-top: 40px;font-size: 14px;color: #4a4a4a;margin-bottom: 15px;font-weight: 500;position: relative;}.footer-col ul li a {font-size: 12px;color: #4a4a4a;text-decoration: none;font-weight: 300;}.footer-col ul li a:hover {color: #5a7155;}.other-logo {margin-top: 40px;padding-right: 40px;}@media only screen and (max-width: 768px) {.navbar {padding: 12px 20px;box-shadow: none;}.logo {width: 80px;height: auto;}.menu-icon {display: block;position: fixed;right: 20px;top: 20px;}.navbar ul {display: none;flex-direction: column;position: fixed;top: 0;left: 0;width: 100%;height: 100vh;background-color: #ffffff;text-align: right;padding: 100px 80px 40px;opacity: 0;visibility: hidden;transition: all 0.3s ease-in-out;z-index: 999;overflow-y: auto;}.navbar ul.active {display: flex;opacity: 1;visibility: visible;}.navbar ul li {display: block;margin: 15px 0;padding: 12px 0;}.navbar ul li:last-child {border-bottom: none;}.navbar ul li a {font-size: 18px;color: #5a7155;text-decoration: none;}.navbar ul li a:hover {text-decoration: none;}.navbar ul::before {content: '';display: block;background: url(../media/logo.webp) no-repeat center;background-size: contain;width: 80px;height: 40px;position: absolute;top: 15px;left: 20px;}.navbar ul li:hover::after {width: 0;}.hero {background-attachment: scroll;height: 100vh;padding: 120px 20px;align-items: center;}.hero h1 {font-size: 36px;text-align: center;}.hero p {font-size: 18px;text-align: center;}.button {width: 180px;}.work-with-us {flex-direction: column;}.work-with-us-text {width: 100%;}.services {padding: 0;}.about, .contact {padding: 20px 40px;height: auto;}.portfolio {padding: 20px 40px;}.portfolio-grid {grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));}.services h2, .about h2, .contact h2, .portfolio h2 {font-size: 28px;padding-bottom: 30px;}.about p, .contact p, .portfolio p {font-size: 16px;}.services {grid-template-columns: 1fr;margin: 20px;gap: 20px;}.stats {background-image: url("../media/laptops-mb.webp"), linear-gradient(90deg, #5a7155, #3a5a40);background-attachment: scroll;}}.stats::before {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(90, 113, 85, 0.85);z-index: 1;}.stats .container {position: relative;z-index: 2;display: flex;justify-content: space-around;flex-wrap: wrap;}.service {width: 100%;height: auto;margin-bottom: 30px;}.services-header {margin: 40px 0;}form {margin-top: 50px;}.another-container {padding-left: 20px;}.footer {padding: 40px 20px 60px;height: auto;}.footer-col {width: 100% !important;padding: 0 !important;margin-bottom: 30px;}.other-logo {order: 3;margin-top: 20px;padding: 0;width: 100%;text-align: center;}.row {order: 1;width: 100%;flex-direction: column;}.footer-col:last-child {margin-bottom: 0;}