@charset "UTF-8";@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 400; src: local('Roboto'), local('Roboto-Regular'), url('../fonts/Roboto-Regular.woff2') format('woff2'), url('../fonts/Roboto-Regular.woff') format('woff'), url('../fonts/Roboto-Regular.ttf') format('truetype');}:root { --base-color: 8, 96, 102; --background-grade-05: rgba(var(--base-color), 0.05); --background-grade-50: rgba(var(--base-color), 0.5); --background-grade-80: rgba(var(--base-color), 0.8); --background-white: rgba(255, 255, 255, 0.9); --primary-collor: rgba(var(--base-color), 0.99); --backgrount1: #f8fafc; --backgrount2: #1b5555; --backgrount3: #073333; --color-white: #fff; --color-nav: #333; --color-danger: #dc3545; --color-success: #28a745; --color-hover: #ff9900; --shadow-sm: 0 3px 8px rgba(0, 0, 0, 0.05); --border-sm: 1px solid rgba(0, 0, 0, 0.1); --radius-sm: 4px; --radius-md: 8px; --shadow-card-hover: 0 12px 40px rgba(0, 0, 0, .15); --transition-default: all .3s cubic-bezier(.4, 0, .2, 1);}html,body { font-family: 'Roboto', sans-serif; margin: 0; background: var(--backgrount1); color: var(--color-nav); line-height: 1.6; width: 100%; max-width: 1200px; place-self: center;}*,*::before,*::after { box-sizing: border-box; margin: 0; padding: 0;}*:focus { outline: none;}h1 { font-size: 1.8em; margin-bottom: 1em;}h2 { font-size: 1.6em; margin: 1em 0;}h3 { font-size: 1.3em; margin-bottom: 1em;}.logo { border-radius: 5px;}.logo img { display: block; border-radius: var(--radius-md); padding: 0 0.33em; width: auto; height: 3.3em;}/* Header and Navigation Styles */.header { display: flex; justify-content: space-between; align-items: center; position: relative; background-color: var(--background-grade-05); padding: 1em 5%;}.header-right { display: flex; align-items: center;}.header-right .lang-form { margin-right: 1.5em;}nav { margin: 0 15px; text-decoration: none; padding: 0.5em 0; white-space: nowrap; font-weight: 600; position: relative;}nav ul { display: flex;}nav li { list-style: none; margin: 0 10px;}.nav-menu li a { position: relative; text-decoration: none; font-size: var(--font-size-lg); font-weight: 600; color: var(--primary-collor);}.nav-menu li a::after { content: ''; position: absolute; bottom: -5px; left: 0; width: 100%; height: 2px; background-color: var(--color-hover, #007BFF); transform: scaleX(0); transform-origin: bottom right; transition: transform 0.4s ease-out;}.nav-menu li a:hover::after { transform: scaleX(1); transform-origin: bottom left;}.hamburger-menu { display: none; flex-direction: column; justify-content: space-around; width: 30px; height: 25px; cursor: pointer; z-index: 1001;}.hamburger-menu span { display: block; width: 100%; height: 3px; background-color: var(--primary-collor); border-radius: 2px; transition: all 0.3s ease-in-out;}input,label,select { width: 100%; border-radius: var(--radius-sm); padding: 0.5rem; border: var(--border-sm); transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;}label { border: none;}input:focus,input:active,input:focus-visible { border: 1px solid var(--background-grade-50) !important;}input:hover { border: 1px solid var(--background-grade-50); box-shadow: var(--shadow-sm); transition: all .2s;}input[type=checkbox] { border: none; box-shadow: none;}.top { min-height: 30vh; color: var(--color-white); text-align: center; padding: 70px 40px;}.about { background-image: linear-gradient(rgba(7, 51, 51, 0.9), rgba(7, 51, 51, 0.85)), url("../img/about.webp"); background-size: cover; background-position: center center; background-repeat: no-repeat;}.hero { min-height: 60vh; display: flex; flex-direction: column; justify-content: center; background-image: linear-gradient(rgba(0, 0, 0, 0.55), rgba(0, 0, 0, 0.55)), url("../img/hero.webp"); background-size: cover; background-position: center center; background-repeat: no-repeat; color: var(--color-white); padding: 80px 40px; text-align: center;}.hero h1,.top h1 { font-size: 42px; margin-bottom: 10px;}.hero p,.top p { font-size: 20px; max-width: 700px; margin: auto;}.cta { margin-top: 30px; background: var(--backgrount2); color: var(--color-white); text-align: center; padding: 70px 40px;}.button { display: inline-block; background: var(--backgrount2); color: var(--color-white); padding: 14px 26px; border: var(--border-sm); border-radius: 6px; text-decoration: none; font-weight: bold;}.section { padding: 20px 40px 20px 40px; margin: auto;}.section h2 { text-align: center;}.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 30px;}.card { background: var(--color-white); padding: 25px; border-radius: 8px; box-shadow: var(--shadow-sm); transition: var(--transition-default);}.cta-section { background: var(--backgrount2); color: var(--color-white); text-align: center; padding: 70px 40px;}.little { font-family: 'Times New Roman', Times, serif; font-style: italic; color: #ff9900;}.erp { font-style: italic; font-weight: 600;}.alert { color: var(--color-danger); margin: 1em 0; font-weight: 600; border: 1px solid; padding: 0.33em;}.success { color: var(--color-success); margin: 1em 0; font-weight: 600; border: 1px solid; padding: 0.33em;}footer { background: var(--backgrount3); color: var(--color-white); padding: 30px 40px; text-align: center;}.pricing { padding: 40px 40px; text-align: center; background: var(--backgrount1);}.pricing-subtitle { display: inline; margin-bottom: 50px; color: #666;}.pricing-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 30px; padding-top: 2em; margin: auto;}.pricing-card { background: white; padding: 35px; border-radius: 10px; box-shadow: var(--shadow-sm); transition: var(--transition-default);}.card:hover,.pricing-card:hover { box-shadow: var(--shadow-card-hover);}.pricing-card h3 { margin-bottom: 10px;}.price { font-size: 36px; font-weight: bold; margin: 20px 0;}.price span { font-size: 16px; color: #666;}.pricing-card ul { list-style: none; padding: 0; margin: 25px 0;}.pricing-card li { padding: 8px 0; border-bottom: var(--border-sm);}.pricing-button { display: inline-block; margin-top: 20px; background: var(--backgrount2); color: var(--color-white); padding: 12px 24px; border-radius: 6px; text-decoration: none; font-weight: bold;}.pricing-card.featured { border: 2px solid var(--backgrount2); transform: scale(1.05);}.modal-overlay { display: none; position: fixed; inset: 0; background: rgba(0, 0, 0, 0.6); justify-content: center; align-items: center;}.modal { background: #fff; padding: 20px; border-radius: 8px; width: 90%; max-width: 400px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);}.modal label { display: block; margin: 5px 0;}.modal input { width: unset; margin-right: 1rem;}.modal-footer { margin-top: 15px; text-align: right;}.login { width: 100%; display: flex; flex-direction: column; flex-wrap: wrap; align-content: center; justify-content: center; padding: 0; margin: 0;}.login .card { margin: 10em 1em; padding: 2em 1em; place-self: center; width: 100%; max-width: 20em;}.login-bg { background-image: linear-gradient(rgba(0, 0, 0, 0.55), rgba(0, 0, 0, 0.55)), url("../img/login.webp"); background-size: cover; background-position: center center; background-repeat: no-repeat;}.auth-links { display: flex; gap: 0.75rem; justify-content: center; align-items: center; flex-wrap: wrap; margin: 1rem 0 0; font-size: 0.95rem;}.auth-links a { color: var(--backgrount2); font-weight: 600; text-decoration: none;}.auth-links a:hover { text-decoration: underline;}@media only screen and (max-device-width: 480px) { .header { padding: 10px; } .header nav { display: none; flex-direction: column; width: 100%; background-color: var(--background-grade-80); position: absolute; top: 100%; left: 0; padding: 1em 0; box-shadow: var(--shadow-sm); z-index: 1000; text-align: center; } .nav-menu { display: flex; flex-direction: column; } .nav-menu li { margin: 5px 10px; } .header nav.active { display: flex; } .header nav a { color: var(--background-white); border-bottom: var(--border-sm); } .header nav a:last-child { border-bottom: none; } .hamburger-menu { display: flex; } .section { padding: 14px; } .login .card { margin: 5em 1em; }}