add sectioned template style

assets/css/src/generic.css

@@ -161,3 +161,13 @@
 .no-padding {
   padding: 0 !important;
 }
+
+.shift-large {
+  margin-left: var(--shift-large);
+}
+.shift-medium {
+  margin-left: var(--shift-medium);
+}
+.shift-small {
+  margin-left: var(--shift-small);
+}

assets/css/src/page-sectioned.css

@@ -0,0 +1,20 @@
+[data-template="sectioned"] main p {
+  font-size: var(--font-size-s);
+}
+
+[data-template="sectioned"] main .big p {
+  font-size: var(--font-size-m);
+}
+
+[data-template="sectioned"] main h2 {
+  font-weight: bold;
+  margin-bottom: calc(var(--padding-vertical) / 1.5);
+}
+
+[data-template="sectioned"] .blocks > *:not(:last-child) {
+  margin-bottom: 1rem;
+}
+
+[data-template="sectioned"] main section:nth-child(odd):not(:first-child) {
+  background-color: var(--color-brown-light);
+}

assets/css/src/variables.css

@@ -11,6 +11,10 @@
   --font-size-h1: 2.8125rem;
   --font-size-xl: 3.75rem;
 
+  --shift-large: 7vw;
+  --shift-medium: calc(var(--shift-large) / 2);
+  --shift-small: calc(var(--shift-medium) / 2);
+
   --curve-quick-slow: cubic-bezier(0.455, 0.03, 0.515, 0.955);
   --curve-quick: cubic-bezier(0.23, 1, 0.32, 1);
   --padding-vertical: 2rem;