Refactor SCSS and HTML for improved layout, typography, and animations

layouts/partials/section-grid.html

@@ -1,16 +1,15 @@
 {{ with site.GetPage .page }}
   {{ with .Params.service }}
-    <section class="section">
       <div class="my-container">
         <div class="section-title text-center">
-          <h1>{{ .title | markdownify }}</h1>
-          <h2>{{ .description | markdownify }}</h2>
+          <h1 data-aos="fade-up">{{ .title | markdownify }}</h1>
+          <h2 data-aos="fade-up">{{ .description | markdownify }}</h2>
         </div>
 
-        <div class="responsive-grid mt-4 {{ if eq $.type "zoom" }}service-grid{{ end }}">
+        <div class="responsive-grid mt-4 {{ if eq $.type "zoom" }}service-grid{{ end }}" data-aos="zoom-in-up">
           {{ range .service_item }}
             {{ if eq $.type "zoom" }}
-              <div class="service-item zoom-wrap">
+              <div class= "service-item zoom-wrap" >
                 <a href="{{ .link | relURL }}">
                   <img src="{{ .picture | relURL }}" alt="{{ .name }}">
                   <div class="overlay"></div>
@@ -27,6 +26,6 @@
           {{ end }}
         </div>
       </div>
-    </section>
+
   {{ end }}
 {{ end }}

layouts/partials/style.html

@@ -13,4 +13,4 @@
 {{ end }}
 {{ $styles := $styles | append (resources.Get "scss/style.scss" | resources.ExecuteAsTemplate "style.scss" . | toCSS) }}
 {{ $styles := $styles | resources.Concat "/css/style.css" | minify | fingerprint "sha512"}}
-<style type="text/css">{{$styles.Content | safeCSS}}</style>
+<link rel="stylesheet" href="{{ $styles.Permalink }}">