update screen fix

src/components/sections/WhyChooseDoormile.tsx

@@ -195,28 +195,37 @@ export default function WhyChooseDoormile() {
           flex-direction: column;
           gap: 16px;
         }
-        .wcd-card-points li {
-          position: relative;
-          padding-left: 30px;
+        .wcd-section .wcd-card-points li {
+          /* Flex row so the check icon and its label always sit on the same line.
+             Scoped with .wcd-section to outrank the global ".logico-front-end ul li"
+             theme rule, which adds 1.7em padding + a fontello bullet icon. */
+          display: flex;
+          align-items: flex-start;
+          gap: 12px;
+          padding-left: 0;
           font-size: 16px;
           font-weight: 700;
           line-height: 1.3;
           color: #FFFFFF;
         }
-        .wcd-card-points li::before {
-          content: "";
-          position: absolute;
-          left: 0;
-          top: 0.18em;
-          width: 14px;
-          height: 9px;
-          border-left: 2px solid #c01227;
-          border-bottom: 2px solid #c01227;
-          transform: rotate(-45deg) scale(1);
+        /* Suppress the theme's default fontello list bullet
+           (.logico-front-end ul li:before) so only our circle-check SVG renders. */
+        .wcd-section .wcd-card-points li::before {
+          content: none;
+          display: none;
+        }
+        /* Clean circle-check feature icon (inline SVG, see markup below) — replaces
+           the old border-based chevron. Brand red with thin, rounded strokes. */
+        .wcd-card-points .wcd-check {
+          flex: 0 0 auto;
+          width: 18px;
+          height: 18px;
+          margin-top: 0.12em;
+          color: #c01227;
           transition: transform 0.3s ease;
         }
-        .wcd-card:hover .wcd-card-points li::before {
-          transform: rotate(-45deg) scale(1.1);
+        .wcd-card:hover .wcd-card-points .wcd-check {
+          transform: scale(1.1);
         }
 
          @media (max-width: 1020px) {
@@ -266,7 +275,22 @@ export default function WhyChooseDoormile() {
                     <p className="wcd-card-desc">{stage.desc}</p>
                     <ul className="wcd-card-points">
                       {stage.points.map((point) => (
-                        <li key={point}>{point}</li>
+                        <li key={point}>
+                          <svg
+                            className="wcd-check"
+                            viewBox="0 0 24 24"
+                            fill="none"
+                            stroke="currentColor"
+                            strokeWidth={2}
+                            strokeLinecap="round"
+                            strokeLinejoin="round"
+                            aria-hidden="true"
+                          >
+                            <circle cx="12" cy="12" r="10" />
+                            <path d="m9 12 2 2 4-4" />
+                          </svg>
+                          <span>{point}</span>
+                        </li>
                       ))}
                     </ul>
                   </div>