/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/

:root { --ds-ink: #0f172a; --ds-muted: #5f6b7a; --ds-line: #dbe3ee; --ds-blue: #2563eb; --ds-cyan: #06b6d4; --ds-soft: #f5f8fc; }
body { color: var(--ds-ink); font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.home .page-title { display: none; }
.ds-home { overflow: hidden; background: #fff; }
.ds-shell { width: min(1160px, calc(100% - 40px)); margin: 0 auto; }
.ds-hero { position: relative; padding: 112px 0 96px; color: #fff; background: radial-gradient(circle at 80% 16%, rgba(6,182,212,.38), transparent 34%), linear-gradient(135deg, #081529 0%, #12366e 58%, #2563eb 100%); }
.ds-hero::after { position: absolute; right: -120px; bottom: -220px; width: 520px; height: 520px; border: 1px solid rgba(255,255,255,.18); border-radius: 50%; content: ""; }
.ds-kicker { display: inline-flex; padding: 8px 14px; border: 1px solid rgba(255,255,255,.28); border-radius: 999px; background: rgba(255,255,255,.1); font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.ds-hero h1 { max-width: 820px; margin: 22px 0 18px; color: #fff; font-size: clamp(44px, 7vw, 82px); font-weight: 800; letter-spacing: -.045em; line-height: .98; }
.ds-hero p { max-width: 660px; margin: 0; color: rgba(255,255,255,.78); font-size: 18px; line-height: 1.75; }
.ds-section { padding: 80px 0; }
.ds-section-head { max-width: 700px; margin-bottom: 36px; }
.ds-section-head h2 { margin-bottom: 10px; color: var(--ds-ink); font-size: clamp(30px, 4vw, 46px); letter-spacing: -.035em; }
.ds-section-head p { color: var(--ds-muted); font-size: 17px; }
.ds-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.ds-card { min-height: 220px; padding: 30px; border: 1px solid var(--ds-line); border-radius: 20px; background: #fff; box-shadow: 0 16px 40px rgba(15,23,42,.07); }
.ds-card span { display: grid; width: 48px; height: 48px; margin-bottom: 36px; place-items: center; border-radius: 14px; background: linear-gradient(135deg, var(--ds-blue), var(--ds-cyan)); color: #fff; font-weight: 800; }
.ds-card h3 { margin-bottom: 8px; color: var(--ds-ink); font-size: 21px; }
.ds-card p { margin: 0; color: var(--ds-muted); line-height: 1.7; }
.ds-status { padding: 54px 0; background: var(--ds-soft); }
.ds-status .ds-shell { display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.ds-status h2 { margin: 0 0 8px; color: var(--ds-ink); font-size: 28px; }
.ds-status p { margin: 0; color: var(--ds-muted); }
.ds-status-badge { flex: 0 0 auto; padding: 11px 16px; border-radius: 999px; background: #dcfce7; color: #166534; font-size: 13px; font-weight: 800; }


@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/
	.ds-shell { width: min(100% - 28px, 1160px); }
	.ds-hero { padding: 82px 0 70px; }
	.ds-hero p { font-size: 16px; }
	.ds-section { padding: 58px 0; }
	.ds-grid { grid-template-columns: 1fr; }
	.ds-card { min-height: 0; }
	.ds-card span { margin-bottom: 24px; }
	.ds-status .ds-shell { align-items: flex-start; flex-direction: column; }
}
