Content Rewrite

src/lib/styles/sections.css

@@ -3,7 +3,7 @@ section {
 }
 
 #hero {
-  background: var(--green);
+  background: var(--gw-green);
   color: #fff;
   padding: 44px 50px 0;
   display: flex;
@@ -207,7 +207,7 @@ section {
   padding: 9px 16px;
   border-radius: 999px;
   background: rgba(255, 255, 255, 0.92);
-  color: var(--green);
+  color: var(--gw-green);
   font-size: 16px;
   font-weight: 700;
   text-decoration: none;
@@ -282,9 +282,35 @@ section {
   align-items: flex-end;
 }
 
+.promise-img-frame {
+  position: relative;
+  width: min(100%, 520px);
+  padding: 18px 18px 32px 32px;
+  border-radius: 32px;
+  background: linear-gradient(180deg, #faf8f3 0%, #f2eee6 100%);
+  box-shadow: 0 18px 34px rgba(17, 20, 24, 0.08);
+}
+
+.promise-img-frame::before {
+  content: '';
+  position: absolute;
+  left: 0;
+  right: 46px;
+  bottom: 0;
+  height: 18px;
+  border-radius: 999px;
+  background: var(--gw-green);
+  opacity: 0.14;
+  pointer-events: none;
+}
+
 .promise-img img {
   width: 100%;
   max-width: 560px;
+  display: block;
+  border-radius: 28px 28px 88px 28px;
+  box-shadow: 0 10px 24px rgba(17, 20, 24, 0.1);
+  object-fit: cover;
 }
 
 .service-card {
@@ -344,7 +370,7 @@ section {
 
 .service-card .service-card-icon {
   font-size: 34px;
-  color: var(--green);
+  color: var(--gw-green);
   margin-bottom: 0;
 }
 
@@ -355,7 +381,7 @@ section {
   padding: 6px 14px;
   border-radius: 999px;
   background: rgba(33, 48, 33, 0.06);
-  color: var(--green);
+  color: var(--gw-green);
   font-family: var(--font-head);
   font-size: 14px;
   font-weight: 700;
@@ -372,7 +398,7 @@ section {
 
 #values,
 footer {
-  background: var(--green);
+  background: var(--gw-green);
   color: #fff;
 }
 
@@ -470,7 +496,7 @@ footer {
 }
 
 .info-copy a {
-  color: var(--green);
+  color: var(--gw-green);
   font-weight: 600;
 }
 
@@ -495,7 +521,7 @@ footer {
 .faq summary::after {
   content: '+';
   font-size: 20px;
-  color: var(--green);
+  color: var(--gw-green);
 }
 
 .faq details[open] summary::after {
@@ -520,7 +546,7 @@ footer {
 }
 
 #instagram .btn {
-  background: var(--green);
+  background: var(--gw-green);
   color: #fff;
 }
 
@@ -594,13 +620,14 @@ footer {
 
 .footer-nav {
   list-style: none;
-  columns: 2;
-  column-gap: 24px;
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 2px 24px;
 }
 
 .footer-nav li {
   margin: 0;
-  break-inside: avoid;
+  min-width: 0;
 }
 
 .footer-nav a {