*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Raleway',sans-serif;font-weight: 400;line-height:1;color:#374151;overflow-x:hidden}
#nomty-video{position:fixed;top:0;left:0;width:100vw;height:100vh;object-fit:cover;z-index:-1;pointer-events:none}
::-webkit-scrollbar{width:8px}
::-webkit-scrollbar-track{background:#DDD6CB}
::-webkit-scrollbar-thumb{background:#888;border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:#555}
@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
@keyframes bounce{0%,20%,53%,80%,100%{transform:translateY(0)}40%,43%{transform:translateY(-10px)}70%{transform:translateY(-5px)}90%{transform:translateY(-3px)}}
.animate-fade-in{animation:fadeInUp 0.8s ease-out forwards;opacity:0}
.animate-bounce{animation:bounce 2s infinite}
.fade-in-visible{opacity:1;transform:translateY(0);transition:all 1s ease-out}
.fade-in-hidden{opacity:0;transform:translateY(20px);transition:all 1s ease-out}
.hero-section{min-height:100vh;width:100%;background-color:#37415150;display:flex;flex-direction:column;align-items:center;justify-content:center;align-content:center;text-align:center;padding:0 1rem;position:relative;overflow:hidden}
.hero-content{position:relative;z-index:2}
.hero-content h1{font-size:clamp(3rem, 8vw, 6rem);font-weight:800;color:darkolivegreen;margin-bottom:1rem;animation-delay:0s;text-shadow:2px 2px 4px rgb(0 0 0 / .7)}
.hero-content .subtitle{font-size:clamp(1.25rem, 3vw, 2rem);color: darkolivegreen;margin-bottom:.5rem;animation-delay:0.3s;text-shadow:1px 1px 2px rgb(0 0 0 / .7)}
.hero-content .main-heading{font-size:clamp(2rem, 5vw, 4rem);font-weight:600;color: darkolivegreen;margin-bottom:2rem;line-height:1.2;animation-delay:0.6s;text-shadow:1px 1px 2px rgb(0 0 0 / .7)}
.hero-buttons{display:flex;flex-direction:column;gap:1rem;align-items:center;animation-delay:0.9s;position:relative;justify-content:center;z-index:2}
@media (min-width:640px){.hero-buttons{flex-direction:row}}.btn{padding:.75rem 2rem;border-radius:9999px;font-weight:500;text-decoration:none;transition:all 0.3s ease;cursor:pointer;border:none;font-size:1rem;display:inline-block}
.btn:hover{transform:scale(1.05)}
.btn-primary{background-color:rgb(31 41 55 / .9);color:#fff;backdrop-filter:blur(5px)}
.btn-primary:hover{background-color:rgb(55 65 81 / .9)}
.btn-outline{background-color:rgb(255 255 255 / .2);color:#fff;border:2px solid #fff;backdrop-filter:blur(5px)}
.btn-outline:hover{background-color:rgb(255 255 255 / .3);color:#fff}
.scroll-indicator{position:absolute;bottom:2rem;cursor:pointer;color:#fff;z-index:2;text-shadow:1px 1px 2px rgb(0 0 0 / .7)}
.about-section{min-height:100vh;background-color:#DDD6CB;padding:5rem 1rem;position:relative;z-index:1}
.about-content{max-width:72rem;margin:0 auto}
.section-header{text-align:center;margin-bottom:4rem}
.section-header h2{font-size:clamp(3rem, 6vw, 5rem);font-weight:800;color:#1f2937;margin-bottom:1rem}
.section-header h3{font-size:clamp(1.5rem, 3vw, 2.5rem);color:darkolivegreen;margin-bottom:2rem}
.section-header .highlight{font-size:1.25rem;color:darkolivegreen;font-weight:500}
.about-text{max-width:56rem;margin:0 auto;color:slategrey;font-size:1.125rem;line-height:1.8}
.about-text p{margin-bottom:1.5rem}
.pricing-section{min-height:100vh;background-color:#DDD6CB;padding:5rem 1rem;position:relative;z-index:1}
.pricing-grid{display:grid;grid-template-columns:1fr;gap:2rem;max-width:72rem;margin:0 auto}@media (min-width:768px){.pricing-grid{grid-template-columns:repeat(3,1fr)}}
.pricing-card{background:#fff;border-radius:1rem;padding:2rem;box-shadow:0 10px 25px rgb(0 0 0 / .1);transition:all 0.3s ease}
.pricing-card:hover{transform:translateY(-5px);box-shadow:0 20px 40px rgb(0 0 0 / .15)}.pricing-card.featured{border:2px solid darkolivegreen}
.pricing-card h3{font-size:2rem;font-weight:700;color:#1f2937;margin-bottom:.5rem}
.pricing-card .price{font-size:2.5rem;font-weight:700;margin-bottom:1.5rem}
.pricing-card .price.free{color:#2F4F4F}
.pricing-card .price.paid{color:#7E7364}
.pricing-card .price.host{color:#8C7FC4}
.pricing-card .subtitle{font-size:1.25rem;font-weight:600;color:#4b5563;margin-bottom:1.5rem}
.pricing-features{list-style:none;margin-bottom:2rem}
.pricing-features li{display:flex;align-items:center;margin-bottom:1rem;font-size:1rem;color:#4b5563}
.pricing-features .material-icons{color:#2F4F4F;margin-right:.75rem;font-size:1.25rem}
.pricing-card .btn{width:100%;text-align:center}
.btn-green{background-color:#2F4F4F;color:#fff}
.btn-green:hover{background-color:#2A6969}
.btn-brown{background-color:#7E7364;color:#fff}
.btn-brown:hover{background-color:#987E5A}
.btn-purple{background-color:#8C7FC4;color:#fff}
.btn-purple:hover{background-color:#C1BBDD}
.contact-section{background-color:#DDD6CB;padding:5rem 1rem;text-align:center;position:relative;z-index:1}
.contact-content{max-width:56rem;margin:0 auto}
.contact-content h2{font-size:clamp(2.5rem, 5vw, 4rem);font-weight:700;color:darkolivegreen;margin-bottom:2rem}
.contact-email{display:inline-flex;align-items:center;font-size:1.5rem;color:#2F4F4F;text-decoration:none;margin-bottom:2rem;transition:color 0.3s ease}
.contact-email:hover{color:#C1BBDD}.contact-email .material-icons{margin-right:.75rem;font-size:1.5rem}.copyright{color:#6b7280;font-size:1.125rem}