/* Scoped to: mobile-launch-template-our-features */
[data-component-slug="mobile-launch-template-our-features"].our-features-section, [data-component-slug="mobile-launch-template-our-features"] .our-features-section { width: 100%; background: #000000; padding: 120px 96px; color: #ffffff; font-family: "DM Sans", sans-serif; } [data-component-slug="mobile-launch-template-our-features"].our-features-wrapper, [data-component-slug="mobile-launch-template-our-features"] .our-features-wrapper { max-width: 1728px; margin: 0 auto; display: flex; flex-direction: column; gap: 80px; } [data-component-slug="mobile-launch-template-our-features"].features-header, [data-component-slug="mobile-launch-template-our-features"] .features-header { display: grid; grid-template-columns: 220px 2fr 1fr; gap: 80px; align-items: center; } [data-component-slug="mobile-launch-template-our-features"].features-header-left, [data-component-slug="mobile-launch-template-our-features"] .features-header-left { display: flex; align-items: center; gap: 10px; } [data-component-slug="mobile-launch-template-our-features"].features-header-left .dot, [data-component-slug="mobile-launch-template-our-features"] .features-header-left .dot { width: 8px; height: 8px; background: #ffffff; border-radius: 50%; } [data-component-slug="mobile-launch-template-our-features"].features-header-left span, [data-component-slug="mobile-launch-template-our-features"] .features-header-left span { font-size: 20px; font-weight: 700; color: #969696; text-transform: uppercase; } [data-component-slug="mobile-launch-template-our-features"].features-header-center h2, [data-component-slug="mobile-launch-template-our-features"] .features-header-center h2 { font-size: 40px; font-weight: 700; line-height: 100%; max-width: 520px; } [data-component-slug="mobile-launch-template-our-features"].features-header-right, [data-component-slug="mobile-launch-template-our-features"] .features-header-right { display: flex; flex-direction: column; gap: 12px; } [data-component-slug="mobile-launch-template-our-features"].features-header-right p, [data-component-slug="mobile-launch-template-our-features"] .features-header-right p { font-size: 24px; font-weight: 400; color: #969696; max-width: 520px; text-align: left; } [data-component-slug="mobile-launch-template-our-features"].view-products, [data-component-slug="mobile-launch-template-our-features"] .view-products { display: inline-flex; align-items: center; gap: 10px; font-size: 24px; color: #ffffff; text-decoration: none; } [data-component-slug="mobile-launch-template-our-features"].feature-row, [data-component-slug="mobile-launch-template-our-features"] .feature-row { display: grid; grid-template-columns: 220px 2fr 622px; gap: 80px; padding-bottom: 64px; border-bottom: 1px solid #2b2b2b; } [data-component-slug="mobile-launch-template-our-features"].feature-index, [data-component-slug="mobile-launch-template-our-features"] .feature-index { font-size: 24px; color: #969696; } [data-component-slug="mobile-launch-template-our-features"].feature-content h3, [data-component-slug="mobile-launch-template-our-features"] .feature-content h3 { font-size: 40px; font-weight: 700; margin-bottom: 16px; } [data-component-slug="mobile-launch-template-our-features"].feature-content p, [data-component-slug="mobile-launch-template-our-features"] .feature-content p { font-size: 24px; font-weight: 400; color: #969696; margin-bottom: 24px; max-width: 520px; } [data-component-slug="mobile-launch-template-our-features"].feature-stat strong, [data-component-slug="mobile-launch-template-our-features"] .feature-stat strong { font-size: 40px; font-weight: 700; display: block; margin-bottom: 8px; } [data-component-slug="mobile-launch-template-our-features"].feature-stat span, [data-component-slug="mobile-launch-template-our-features"] .feature-stat span { font-size: 24px; color: #969696; } [data-component-slug="mobile-launch-template-our-features"].feature-image img, [data-component-slug="mobile-launch-template-our-features"] .feature-image img { width: 622px; height: 384px; object-fit: cover; border-radius: 16px; display: block; } @media (max-width: 1024px) { [data-component-slug="mobile-launch-template-our-features"].features-header, [data-component-slug="mobile-launch-template-our-features"] .features-header { grid-template-columns: 1fr; gap: 40px; } [data-component-slug="mobile-launch-template-our-features"].feature-row, [data-component-slug="mobile-launch-template-our-features"] .feature-row { grid-template-columns: 1fr; gap: 40px; } [data-component-slug="mobile-launch-template-our-features"].feature-image img, [data-component-slug="mobile-launch-template-our-features"] .feature-image img { width: 100%; height: auto; } } @media (max-width: 640px) { [data-component-slug="mobile-launch-template-our-features"].our-features-section, [data-component-slug="mobile-launch-template-our-features"] .our-features-section { padding: 80px 20px; } [data-component-slug="mobile-launch-template-our-features"].features-header-left h2, [data-component-slug="mobile-launch-template-our-features"] .features-header-left h2 { font-size: 28px; } [data-component-slug="mobile-launch-template-our-features"].feature-content h3, [data-component-slug="mobile-launch-template-our-features"] .feature-content h3 { font-size: 28px; } [data-component-slug="mobile-launch-template-our-features"].feature-content p, [data-component-slug="mobile-launch-template-our-features"] .feature-content p, [data-component-slug="mobile-launch-template-our-features"].feature-stat span, [data-component-slug="mobile-launch-template-our-features"] .feature-stat span { font-size: 18px; } [data-component-slug="mobile-launch-template-our-features"].feature-stat strong, [data-component-slug="mobile-launch-template-our-features"] .feature-stat strong { font-size: 28px; } } [data-component-slug="mobile-launch-template-our-features"].features-header, [data-component-slug="mobile-launch-template-our-features"] .features-header { grid-template-columns: 180px 1fr 622px; align-items: flex-start; } [data-component-slug="mobile-launch-template-our-features"].features-header-left, [data-component-slug="mobile-launch-template-our-features"] .features-header-left { padding-top: 6px; } [data-component-slug="mobile-launch-template-our-features"].features-header-center h2, [data-component-slug="mobile-launch-template-our-features"] .features-header-center h2 { max-width: 520px; margin-top: 0; } [data-component-slug="mobile-launch-template-our-features"].features-header-right, [data-component-slug="mobile-launch-template-our-features"] .features-header-right { align-items: flex-start; justify-content: center; padding-top: 6px; } [data-component-slug="mobile-launch-template-our-features"].features-header-right p, [data-component-slug="mobile-launch-template-our-features"] .features-header-right p { max-width: 520px; } [data-component-slug="mobile-launch-template-our-features"].view-products, [data-component-slug="mobile-launch-template-our-features"] .view-products { margin-top: 8px; } @media (max-width: 1024px) { [data-component-slug="mobile-launch-template-our-features"].features-header, [data-component-slug="mobile-launch-template-our-features"] .features-header { grid-template-columns: 1fr; gap: 32px; } [data-component-slug="mobile-launch-template-our-features"].features-header-right, [data-component-slug="mobile-launch-template-our-features"] .features-header-right { align-items: flex-start; padding-top: 0; } } @media (max-width: 640px) { [data-component-slug="mobile-launch-template-our-features"].features-header-left, [data-component-slug="mobile-launch-template-our-features"] .features-header-left { padding-top: 0; } [data-component-slug="mobile-launch-template-our-features"].features-header-center h2, [data-component-slug="mobile-launch-template-our-features"] .features-header-center h2 { font-size: 28px; } [data-component-slug="mobile-launch-template-our-features"].features-header-right p, [data-component-slug="mobile-launch-template-our-features"] .features-header-right p { font-size: 18px; } [data-component-slug="mobile-launch-template-our-features"].our-features-wrapper, [data-component-slug="mobile-launch-template-our-features"] .our-features-wrapper { gap: 0px; } } [data-component-slug="mobile-launch-template-our-features"].feature-row, [data-component-slug="mobile-launch-template-our-features"] .feature-row { align-items: flex-start; } [data-component-slug="mobile-launch-template-our-features"].feature-content, [data-component-slug="mobile-launch-template-our-features"] .feature-content { align-self: center; } [data-component-slug="mobile-launch-template-our-features"].feature-index, [data-component-slug="mobile-launch-template-our-features"] .feature-index { align-self: flex-start; } [data-component-slug="mobile-launch-template-our-features"].feature-image, [data-component-slug="mobile-launch-template-our-features"] .feature-image { align-self: flex-start; } [data-component-slug="mobile-launch-template-our-features"].feature-row, [data-component-slug="mobile-launch-template-our-features"] .feature-row { align-items: flex-start; } [data-component-slug="mobile-launch-template-our-features"].feature-index, [data-component-slug="mobile-launch-template-our-features"] .feature-index { padding-top: 64px; } [data-component-slug="mobile-launch-template-our-features"].feature-image, [data-component-slug="mobile-launch-template-our-features"] .feature-image { align-self: flex-start; } @media (min-width: 1024px) and (max-width: 1439px) { [data-component-slug="mobile-launch-template-our-features"].feature-row, [data-component-slug="mobile-launch-template-our-features"] .feature-row { grid-template-columns: 160px 1fr 480px; gap: 48px; } [data-component-slug="mobile-launch-template-our-features"].features-header, [data-component-slug="mobile-launch-template-our-features"] .features-header { overflow: hidden; } [data-component-slug="mobile-launch-template-our-features"].feature-image img, [data-component-slug="mobile-launch-template-our-features"] .feature-image img { width: 100%; max-width: 480px; height: auto; } [data-component-slug="mobile-launch-template-our-features"].feature-content p, [data-component-slug="mobile-launch-template-our-features"] .feature-content p { max-width: 100%; } }