@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100;200;300;400;500;600;700;800;900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@700;800;900&display=swap');


:root {
    --font-default: 'Outfit', sans-serif;
    --font-heading: 'Outfit', sans-serif;
    --font-secondary: 'Manrope', sans-serif;
    --fontawesome: "Font Awesome 5 Pro";
    --black: #000000;
    --dark: #0e2769;
    --dark-secondary: #1e3373;
    --white: #ffffff;
    --color-primary: #632d87;
    --color-secondary: #9c00ff;
    --color-style-two: #B700C4;
    --color-style-three: #FF9B0D;
    --color-heading: #0e0e0e;
    --color-paragraph: #666666;
    --box-shadow-primary: -1px 3px 10px 0 rgba(0, 0, 0, 0.6);
    --box-shadow-secondary: 0 10px 30px 0 rgba(44, 130, 237, 0.4);
    --box-shadow-regular: 0px 2px 12px 0px #e7e7e7;
    --bg-gray: #eff6fe;
    --bg-gradient: linear-gradient(90deg, var(--color-primary) 0%, var(--color-secondary) 100%);
    --bg-gradient-secondary: linear-gradient(0deg, var(--color-primary) 0%, var(--color-secondary) 100%);
    --bg-gradient-two: linear-gradient(90deg, var(--color-style-two) 0%, var(--color-style-three) 100%);
}

.expertise-style-one-thumb img {
    border-radius: 10px;
}

.blog-area blockquote {
    background: var(--bg-gradient);
    border-radius: 10px;
    color: white;
}

.navbar .attr-right .attr-nav li.button a {
    background: var(--bg-gradient) !important;
}

.btn-simple i {

    background: var(--bg-gradient);
}

.info p {
    text-align: justify;
    color: black;
}

.contact-style-one-info li i,
.contact-style-one-info li:nth-child(2) i,
.contact-style-one-info li:nth-child(3) i,
.contact-form-style-one button,
.footer-style-two .footer-bottom,
.services-style-two .thumb .title i::after,
.services-style-two .thumb .title .icon::after,
footer.footer-style-two .f-item.about::after {
    background: var(--bg-gradient);
}

footer p,
footer li,
footer li a {
    color: white !important;
}

.services-style-two .thumb .title a {
    background: white;
    color: black;
}

.services-style-two .thumb .title h4 {
    color: var(--bg-gradient-secondary);
}

/* CKEditor Content Styling */
.ckeditor-content {
    line-height: 1.8;
    color: #333;
}

/* Unordered Lists (Bullet Points) */
.ckeditor-content ul {
    list-style-type: disc !important;
    margin: 15px 0 15px 0 !important;
    padding-left: 40px !important;
}

.ckeditor-content ul li {
    margin-bottom: 8px;
    display: list-item !important;
    list-style: disc !important;
    list-style-position: outside !important;
}

.ckeditor-content ul ul {
    list-style-type: circle !important;
    margin: 8px 0 8px 0 !important;
}

.ckeditor-content ul ul li {
    list-style-type: circle !important;
}

/* Ordered Lists (Numbered Points) */
.ckeditor-content ol {
    list-style-type: decimal !important;
    margin: 15px 0 15px 0 !important;
    padding-left: 40px !important;
}

.ckeditor-content ol li {
    margin-bottom: 8px;
    display: list-item !important;
    list-style: decimal !important;
    list-style-position: outside !important;
}

.ckeditor-content ol ol {
    list-style-type: lower-alpha !important;
    margin: 8px 0 8px 0 !important;
}

/* Paragraphs */
.ckeditor-content p {
    margin-bottom: 15px;
}

/* Headings */
.ckeditor-content h1,
.ckeditor-content h2,
.ckeditor-content h3,
.ckeditor-content h4,
.ckeditor-content h5,
.ckeditor-content h6 {
    margin-top: 20px;
    margin-bottom: 10px;
    font-weight: bold;
}

/* Tables */
.ckeditor-content table {
    width: 100%;
    margin: 20px 0;
    border-collapse: collapse;
}

.ckeditor-content table td,
.ckeditor-content table th {
    border: 1px solid #ddd;
    padding: 8px;
}

.ckeditor-content table th {
    background-color: #f4f4f4;
    font-weight: bold;
}

/* Images */
.ckeditor-content img {
    max-width: 100%;
    height: auto;
    margin: 15px 0;
}

/* Blockquotes */
.ckeditor-content blockquote {
    border-left: 4px solid #ddd;
    padding-left: 20px;
    margin: 20px 0;
    font-style: italic;
    color: #666;
}

/* Strong and Em */
.ckeditor-content strong {
    font-weight: bold;
}

.ckeditor-content em {
    font-style: italic;
}