body { font-family: "Darker Grotesque", sans-serif; font-size: x-large; } .navbar, .navbar * { font-family: "Darker Grotesque", sans-serif !important; } .navbar-brand h1{ padding: 0 2rem; font-weight: 900; } .no-conf-data { display: flex; justify-content: center; align-items: center; text-decoration: none; background-color: #453E4D; color:#FAA95E } .no-conf-data:hover { background-color: #FB4B3F; color: white; } .btn-primary-orn { margin: 0 auto; display: inline-block; border-radius: 40px; text-decoration: none; font-weight: 600; font-size: 1.5rem; color: #fff; background: linear-gradient(90deg, #FAA95E 0%, #FB4B3F 100%); padding: 0.75rem 1.5rem; justify-content: center; align-items: center; text-align: center; } .btn-primary-orn:hover { background: #FB4B3F; color:white; } .btn-secondary-grn{ margin: 0 auto; display: inline-block; border-radius: 40px; text-decoration: none; font-weight: 600; font-size: 1.5rem; color: #fff; background: #0ec97f36; padding: 0.75rem 1.5rem; justify-content: center; align-items: center; text-align: center; } .btn-secondary-grn:hover { background: #FB4B3F; color:white; } .btn-pricing-blc{ margin: 0 auto; display: inline-block; border-radius: 10px; text-decoration: none; border:#453E4D 1px solid; text-decoration: none; font-size: 2rem; color: #fff; justify-content: center; align-items: center; text-align: center; width: 95%; padding: 0.5rem 0rem; } .org-t{ color: orange; } .pricing-card.org-b { border: 2px solid orange; } .btn-pricing-blc:hover { background: #FB4B3F; color:white; } .btn-pricing-org{ margin: 0 auto; display: inline-block; border-radius: 10px; text-decoration: none; border:#453E4D 1px solid; text-decoration: none; font-size: 2rem; color: #fff; justify-content: center; align-items: center; text-align: center; width: 95%; padding: 0.5rem 0rem; background: linear-gradient(90deg, #FAA95E 0%, #FB4B3F 100%); } .btn-pricing-org:hover { background: #FB4B3F; color:white; } .component-title{ width: fit-content; padding: 0.5rem 1.5rem; margin: 0 auto; display: flex; justify-content: center; align-items: center; border: 1px solid #453E4D; border-radius: 30px; color: white; font-size: large; } /* Hero Section */ .hero { text-align: center; padding: 4rem 1rem; background: radial-gradient(35.48% 50.52% at 50% 105.04%, #FAA95E 0%, #101010 100%); color: white; } .hero h1 { font-size: 2.5rem; line-height: 1.2; font-weight: 800; margin-bottom: 1rem; } .hero p { font-size: 1.1rem; color: white; max-width: 700px; margin: 0 auto; } .hero-buttons a { margin: 0.5rem; } /* Pricing Section */ .pricing { padding: 4rem 1rem; background-color: #101010; text-align: center; color: white; } .pricing-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(310px, 1fr)); gap: 2rem; max-width: 1400px; margin: 0 auto; } .pricing-card { border: 1px solid #453E4D; padding: 2rem; border-radius: 12px; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05); background-color: #101010; } .pricing-card h3 { font-size: 1.4rem; margin-bottom: 1rem; } .pricing-card ul { list-style: none; padding: 0; margin: 1rem 0; text-align: left; } .pricing-card ul li { margin-bottom: 0.5rem; color: white; } .marked-org{ padding: 0 3px; background-color: rgb(77, 50, 2); color: orange; border-radius: 50%; } /* Whitepaper Section */ .whitepaper { background-color: #101010; display: grid; justify-content: center; align-items: center; padding: 4rem 1rem; text-align: center; color: white; } .title-org{ color: orange; } .whitepaper h1 { font-size: 4rem; font-weight: 700; margin-bottom: 1rem; } .whitepaper p { color: #fff; } /* Insights Section */ .insights { padding: 4rem 1rem; background-color: #0A0A0A; text-align: center; color: white; } .insights h2 { font-size: 2rem; margin-bottom: 2rem; } .insights-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(310px, 1fr)); gap: 2rem; max-width: 1400px; margin: 0 auto; } .insight-card { border: 1px solid #453E4D; padding: 1.5rem; border-radius: 10px; background-color: #19161C; text-align: left; color: white; } .insight-card h3 { font-weight: 600; color: white; margin-bottom: 0.3rem; } .insight-card h4 { font-weight: 500; color: white; } .insight-card p { color: #929292; } .insight-card h5{ color: orange; } .faq-answer { display: none; margin-top: 0.5rem; color: #ccc; } .faq-card.active .faq-answer { display: flex; } .faq-card.active { display: grid; background-color: #0A0A0A; border-radius: 10px; margin-bottom: 1rem; } .faq-question { cursor: pointer; user-select: none; background-color: #0A0A0A; justify-content: center; align-items: center; border-radius: 10px; padding: 0.5rem 2rem; } .faq-card.active .faq-answer { display: flex; justify-content: center; align-items: center; } .faq-answer p { width: 90%; } .faq-intro{ display: grid; justify-content: center; align-items: center; } .faq-toggle { display: inline-block; transition: transform 0.2s; font-size: 1.0em; } .faq-card.active .faq-toggle { transform: rotate(90deg); } .faq{ display: grid; background-color: #101010; justify-content: center; align-items: center; color: white; gap: 20px; } .faq-grid { display: grid; gap: 1rem; } .form-check.other-gap .other-row { display: flex !important; align-items: center !important; flex-direction: row !important; gap: 0 !important; } .other-gap { display: flex !important; gap: 2rem !important; } .other-gap > .form-control { max-width: 350px; } .confirmed { display: flex; justify-content: center; align-items: center; background: #101010; } .confirmation-card { max-width: 600px; width: 100%; text-align: center; margin: 0 auto; background: #19161C; border-radius: 16px; box-shadow: 0 4px 24px rgba(0,0,0,0.18); border: 1px solid #453E4D; padding: 48px 32px; } .info-p { color: #fff; font-size: 1.1em; margin-bottom: 2rem; } @media (max-width: 768px) { .form-check.other-gap .other-row { flex-direction: column; align-items: flex-start; gap: 0; } .form-check.other-gap .form-control { width: 100%; max-width: 100%; } .other-gap { display: grid !important; gap: 0 !important; } .hero h1 { font-size: 2rem; } .pricing-grid { grid-template-columns: 1fr; } .faq{ padding: 0 1.5rem } }