fix: correct class properties for layout consistency and improve responsiveness

Author: non-stop-dev

src/components/landing/hero/LandingHero.astro

@@ -1,6 +1,6 @@
 <section
 	aria-labelledby="landing-hero-title"
-	class="mx-auto h-[calc(100dvh-var(--nav-height))] max-w-[96rem] px-6 py-10 md:px-10 lg:px-12 lg:py-10"
+	class="mx-auto h-[calc(100dvh-var(--nav-height))] max-w-384 px-6 py-10 md:px-10 lg:px-12 lg:py-10"
 >
 	<div class="grid h-full items-center gap-12 lg:grid-cols-[minmax(0,0.76fr)_minmax(0,1.24fr)] lg:gap-16">
 		<header class="flex max-w-xl flex-col justify-center">
@@ -106,7 +106,7 @@
 
 				<div class="grid gap-4">
 					<article
-						class="brutal-paper w-[78%] justify-self-center rotate-[3deg] bg-white px-6 py-7 sm:w-[60%] sm:px-8 sm:py-8 lg:w-full"
+						class="brutal-paper w-[78%] justify-self-center rotate-3 bg-white px-6 py-7 sm:w-[60%] sm:px-8 sm:py-8 lg:w-full"
 						aria-label="Vista previa de CV optimizado"
 					>
 						<header class="relative z-10 border-b-2 border-(--line) pb-4">
@@ -121,7 +121,7 @@
 							</p>
 
 							<div
-								class="clean-stamp absolute right-2 top-[5.5rem] inline-flex rotate-[-14deg] border-[3px] border-(--brand-optimizer) px-4 py-2 font-mono text-xs font-black uppercase tracking-[0.24em] text-(--brand-optimizer) sm:right-4 sm:top-24"
+								class="clean-stamp absolute right-2 top-22 inline-flex rotate-[-14deg] border-[3px] border-(--brand-optimizer) px-4 py-2 font-mono text-xs font-black uppercase tracking-[0.24em] text-(--brand-optimizer) sm:right-4 sm:top-24"
 								aria-hidden="true"
 							>
 								ATS Ready

src/components/landing/problem/ProblemSection.astro

@@ -42,7 +42,7 @@
 
 		<div class="relative">
 			<aside
-				class="brutal-warning warning-jolt absolute -left-3 top-6 z-20 max-w-[15rem]"
+				class="brutal-warning warning-jolt absolute -left-3 top-6 z-20 max-w-60"
 				aria-label="ATS Warning"
 			>
 				<div class="flex items-start gap-3">
@@ -62,7 +62,7 @@
 						<p class="font-mono text-[0.72rem] font-black uppercase tracking-[0.24em] text-white">
 							ATS Warning
 						</p>
-						<p class="mt-2 max-w-[12rem] text-sm leading-relaxed text-white/95">
+						<p class="mt-2 max-w-48 text-sm leading-relaxed text-white/95">
 							Lo decorativo no siempre se traduce en legible.
 						</p>
 					</div>

src/components/landing/workflow/WorkflowSection.astro

@@ -48,12 +48,12 @@ const steps = [
 	</div>
 
 	<ol
-		class="timeline-sheen mt-10 grid overflow-hidden rounded-[2rem] border-2 border-(--line) bg-white shadow-[10px_10px_0_var(--shadow)] lg:grid-cols-4"
+		class="timeline-sheen mt-10 grid overflow-hidden rounded-4xl border-2 border-(--line) bg-white shadow-[10px_10px_0_var(--shadow)] lg:grid-cols-4"
 	>
 		{steps.map((step, index) => (
 			<li
 				class:list={[
-					'relative flex min-h-[18rem] flex-col justify-between bg-white px-6 py-6 sm:px-7 sm:py-7',
+					'relative flex min-h-72 flex-col justify-between bg-white px-6 py-6 sm:px-7 sm:py-7',
 					index > 0 ? 'border-t-2 border-(--line) lg:border-l-2 lg:border-t-0' : ''
 				]}
 			>

src/components/nav-bar/NavBar.astro

@@ -1,4 +1,4 @@
-<header class="sticky top-0 z-50 h-[var(--nav-height)] w-full border-b-2 border-(--line) bg-white shadow-[0_8px_0_var(--shadow)]">
+<header class="sticky top-0 z-50 h-(--nav-height) w-full border-b-2 border-(--line) bg-white shadow-[0_8px_0_var(--shadow)]">
 	<nav
 		class="grid h-full w-full grid-cols-[auto_1fr_auto] items-center gap-4 px-6 md:px-10 lg:px-12"
 		aria-label="Principal"