fix(whatislove-dev): box overlay click wd-570 (#571)

apps/whatislove-dev/src/styles/blocks/box.css

@@ -1,17 +1,18 @@
 .box {
-	--has-padding-inline-box: 0;
+	--has-padding-inline-box-doubled: 0;
 
 	padding-block: var(--padding-block-box);
-	padding-inline: var(--padding-inline-box);
+	padding-inline: calc(
+		var(--padding-inline-box) +
+			(var(--has-padding-inline-box-doubled) * var(--padding-inline-box))
+	);
 
 	@media (--width-desktop) {
-		--padding-inline-box-default: calc(
-			var(--has-padding-inline-box) * var(--padding-inline-box)
-		);
-
-		padding-inline: calc(
-			50% - (var(--size-inline-box) / 2) +
-				(var(--padding-inline-box-default))
+		box-sizing: border-box;
+		inline-size: 100%;
+		max-inline-size: calc(
+			var(--size-inline-box) + (var(--padding-inline-box) * 2)
 		);
+		margin-inline: auto;
 	}
 }

apps/whatislove-dev/src/styles/blocks/main.css

@@ -4,13 +4,13 @@
 		gap: 50px;
 
 		@media (--width-tablet) {
+			--has-padding-inline-box-doubled: 1;
+
 			grid-template-columns: repeat(2, 1fr);
 			gap: 40px;
 		}
 
 		@media (--width-desktop) {
-			--has-padding-inline-box: 1;
-
 			grid-template-columns: 70% 1fr;
 			gap: 100px;
 		}