From df2f9a047b3ed7db95dad2467fa17f4704d9be74 Mon Sep 17 00:00:00 2001 From: Sizolwakhe Leonard Mthimunye Date: Thu, 5 Mar 2026 00:19:13 +0200 Subject: [PATCH 01/10] add aa html structure --- .../templates/home/forgot-password.html | 101 +----------------- 1 file changed, 3 insertions(+), 98 deletions(-) diff --git a/users_microservice/src/main/resources/templates/home/forgot-password.html b/users_microservice/src/main/resources/templates/home/forgot-password.html index f29fb712..ca4d3bd1 100644 --- a/users_microservice/src/main/resources/templates/home/forgot-password.html +++ b/users_microservice/src/main/resources/templates/home/forgot-password.html @@ -10,103 +10,8 @@ - - + + @@ -130,7 +35,7 @@

Forgot Password

- Back to Login + Back to Login
From b5b2c193db4b9d1399d9b9ef1e5eeab9eb34b661 Mon Sep 17 00:00:00 2001 From: Sizolwakhe Leonard Mthimunye Date: Thu, 5 Mar 2026 00:21:04 +0200 Subject: [PATCH 02/10] add aa html structure --- .../src/main/resources/templates/home/index.html | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/users_microservice/src/main/resources/templates/home/index.html b/users_microservice/src/main/resources/templates/home/index.html index 2700eef4..90b09b48 100644 --- a/users_microservice/src/main/resources/templates/home/index.html +++ b/users_microservice/src/main/resources/templates/home/index.html @@ -14,7 +14,8 @@ - + + From 5d0afdcce46787bd161ea91f1b52b21a28e23050 Mon Sep 17 00:00:00 2001 From: Sizolwakhe Leonard Mthimunye Date: Thu, 5 Mar 2026 00:21:36 +0200 Subject: [PATCH 03/10] add aa html structure --- .../main/resources/templates/home/login.html | 99 +------------------ 1 file changed, 2 insertions(+), 97 deletions(-) diff --git a/users_microservice/src/main/resources/templates/home/login.html b/users_microservice/src/main/resources/templates/home/login.html index 1c2e63f0..b5f180eb 100644 --- a/users_microservice/src/main/resources/templates/home/login.html +++ b/users_microservice/src/main/resources/templates/home/login.html @@ -10,105 +10,10 @@ + + - From e0f240a2a8de287faeaae490c77ea37450754125 Mon Sep 17 00:00:00 2001 From: Sizolwakhe Leonard Mthimunye Date: Thu, 5 Mar 2026 00:22:19 +0200 Subject: [PATCH 04/10] add aa html structure --- .../static/css/forgot-password-styles.css | 64 ++++++ .../main/resources/static/css/login-style.css | 201 +++++------------- 2 files changed, 114 insertions(+), 151 deletions(-) create mode 100644 users_microservice/src/main/resources/static/css/forgot-password-styles.css diff --git a/users_microservice/src/main/resources/static/css/forgot-password-styles.css b/users_microservice/src/main/resources/static/css/forgot-password-styles.css new file mode 100644 index 00000000..c0202485 --- /dev/null +++ b/users_microservice/src/main/resources/static/css/forgot-password-styles.css @@ -0,0 +1,64 @@ + +.hero { + min-height: 35vh; /* shorter than landing page */ + padding: 5rem 1rem 4rem; /* good breathing room top/bottom */ + margin-bottom: 2.5rem; + background-color: #0a0a0a; + border-bottom: 4px solid var(--pink); +} + +/* Force center in all directions */ +.hero { + display: flex !important; + align-items: center !important; + justify-content: center !important; + text-align: center !important; +} + +.hero .container { + max-width: 600px; /* prevents text from stretching too wide */ +} + +.hero h1 { + color: var(--light-orange); + font-size: 2.8rem; + margin-bottom: 1rem; + line-height: 1.1; +} + +.hero .lead { + font-size: 1.25rem; + max-width: 520px; + margin: 0 auto; + color: var(--text-muted); +} + +/* Mobile / smaller screens */ +@media (max-width: 576px) { + .hero { + min-height: 30vh; + padding: 4rem 1rem 3rem; + } + + .hero h1 { + font-size: 2.4rem; + } + + .hero .lead { + font-size: 1.1rem; + } +} + +/* Optional: make form container narrower & more centered */ +.section-grey { + max-width: 460px; /* tighter than default 1400px max */ + padding: 2.25rem 1.75rem; + margin: 0 auto 3rem auto; +} + +/* Optional: slightly larger button for better touch target */ +.btn-primary-custom { + padding: 0.75rem 1.5rem; + font-size: 1.05rem; +} + diff --git a/users_microservice/src/main/resources/static/css/login-style.css b/users_microservice/src/main/resources/static/css/login-style.css index 42213481..548791ea 100644 --- a/users_microservice/src/main/resources/static/css/login-style.css +++ b/users_microservice/src/main/resources/static/css/login-style.css @@ -1,169 +1,68 @@ -:root { - --bg:#0f172a; - --card:#111827; - --text:#e5e7eb; - --muted:#9ca3af; - --brand:#22c55e; - --brand-600:#16a34a; - --danger:#ef4444; - --focus:#60a5fa; - --ring: 0 0 0 3px rgba(96,165,250,.35); -} +/* css/login.css */ +/* ── Override hero for login page only ── */ -* { box-sizing:border-box } -html,body { - height:100%; - margin:0; - font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, sans-serif; - background: radial-gradient(1200px 500px at 20% 10%, #0b1225 0%, var(--bg) 50%, #0b1225 100%); - color:var(--text); -} +/* login.css - overrides & improvements for the welcome section */ -.label { - display: flex; - justify-content: space-between; - font-size: .9rem; - color: black; /* make labels pure white */ - margin-bottom: 6px; +.hero { + min-height: 35vh; /* shorter than landing page */ + padding: 5rem 1rem 4rem; /* good breathing room top/bottom */ + margin-bottom: 2.5rem; + background-color: #0a0a0a; + border-bottom: 4px solid var(--pink); } - -.wrap { min-height:100%; display:grid; place-items:center; padding:2rem 1rem; } - -.card { - width:100%; max-width:420px; - background:linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.02)), var(--card); - border:1px solid rgba(255,255,255,0.08); - border-radius:16px; - box-shadow: 0 20px 50px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.06); - padding:24px; - backdrop-filter:saturate(120%) blur(6px); +/* Force center in all directions */ +.hero { + display: flex !important; + align-items: center !important; + justify-content: center !important; + text-align: center !important; } -.brand { - display: flex; - justify-content: center; /* keep it centered */ - align-items: center; - gap: 1rem; /* more spacing between dot and text */ - margin-bottom: 1.5rem; - transform: scale(1.3); /* makes the whole brand block bigger */ +.hero .container { + max-width: 600px; /* prevents text from stretching too wide */ } -.brand .dot { - width: 24px; /* bigger dot */ - height: 24px; - border-radius: 50%; - background: var(--brand); - box-shadow: 0 0 32px var(--brand); +.hero h1 { + color: var(--light-orange); + font-size: 2.8rem; + margin-bottom: 1rem; + line-height: 1.1; } -.brand h1 { - font-size: 1.8rem; /* larger brand text */ - font-weight: 700; +.hero .lead { + font-size: 1.25rem; + max-width: 520px; + margin: 0 auto; + color: var(--text-muted); } -.title { margin:.25rem 0 1.25rem; font-size:1.35rem; font-weight:600; } -.subtitle { margin:0 0 1.25rem; color:var(--muted); font-size:.95rem; } - -.field { margin-bottom:14px; } - - -.input { - width: 100%; - padding: 12px; - border-radius: 10px; - border: 1px solid rgba(0,0,0,.12); - background: #ffffff; /* white background for contrast */ - color: #000000; /* black text inside inputs */ - outline: none; - transition: border-color .18s ease, box-shadow .18s ease, transform .06s ease; +/* Mobile / smaller screens */ +@media (max-width: 576px) { + .hero { + min-height: 30vh; + padding: 4rem 1rem 3rem; + } + + .hero h1 { + font-size: 2.4rem; + } + + .hero .lead { + font-size: 1.1rem; + } } -.input::placeholder { - color: #555555; /* darker grey placeholder text */ -} - -.input:focus { border-color:var(--focus); box-shadow:var(--ring); } -.input.error { border-color:var(--danger); box-shadow:0 0 0 3px rgba(239,68,68,.25); animation:shake .28s ease-in-out; } -.input.valid { border-color:var(--brand); box-shadow:0 0 0 3px rgba(34,197,94,.22); } - -@keyframes shake { - 25%{ transform:translateX(-6px) } - 50%{ transform:translateX(5px) } - 75%{ transform:translateX(-4px) } -} - -.error-text { margin-top:6px; color:var(--danger); font-size:.85rem; min-height:1em; } - -.actions { margin-top:8px; display:flex; flex-direction:column; gap:10px; } -.btn { width:100%; border:none; border-radius:10px; padding:12px 14px; font-weight:600; cursor:pointer; transition:.18s ease; } -.btn-primary { background:linear-gradient(180deg,var(--brand),var(--brand-600)); color:#062816; box-shadow:0 8px 20px rgba(34,197,94,.35); } -.btn-primary:hover { box-shadow:0 12px 28px rgba(34,197,94,.45); filter:brightness(1.03); } -.btn-secondary { background:rgba(255,255,255,.06); color:var(--text); border:1px solid rgba(255,255,255,.14); } -.btn-secondary:hover { background:rgba(255,255,255,.09); } - - -.link { color:var(--focus); text-decoration:none; font-weight:500; } -.link:hover { text-decoration:underline; } -.links { - display: flex; - justify-content: space-between; - margin-top: 6px; -} - -.center-link { - justify-content: center; /* override to center */ - margin-top: 12px; /* spacing below button */ -} -/* Fullscreen video background */ -#bg-video { - position: fixed; - top: 0; - left: 0; - min-width: 100%; - min-height: 100%; - object-fit: cover; - z-index: -1; /* behind everything */ -} - -.video-container { - position: relative; - min-height: 100vh; /* full screen height */ - display: grid; - place-items: center; /* center card inside */ - overflow: hidden; -} - -.bg-video { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - object-fit: cover; /* cover entire container */ - z-index: -1; /* behind card */ -} - -.card { - position: relative; - z-index: 1; - background: #f0f0f0; /* light grey background */ - color: #111827; /* dark text for contrast */ - -/* above video */ +/* Optional: make form container narrower & more centered */ +.section-grey { + max-width: 460px; /* tighter than default 1400px max */ + padding: 2.25rem 1.75rem; + margin: 0 auto 3rem auto; } -/* Wrapper fills screen height */ -.wrap { - min-height: 100vh; /* full viewport height */ - display: grid; - place-items: center; - padding: 2rem 1rem; - position: relative; - z-index: 1; - background: #ffffff; /* above video */ +/* Optional: slightly larger button for better touch target */ +.btn-primary-custom { + padding: 0.75rem 1.5rem; + font-size: 1.05rem; } -/* Card styling stays the same */ -.or { display:flex; align-items:center; gap:.75rem; margin:12px 0; color:var(--muted); font-size:.9rem; } -.or::before,.or::after { content:""; height:1px; flex:1; background:linear-gradient(90deg,rgba(255,255,255,.0),rgba(255,255,255,.12),rgba(255,255,255,.0)); } \ No newline at end of file From 51775875fd36b55c438b37fbd4de19d4675b8ae8 Mon Sep 17 00:00:00 2001 From: Sizolwakhe Leonard Mthimunye Date: Thu, 5 Mar 2026 00:25:07 +0200 Subject: [PATCH 05/10] add aa html structure --- .../resources/static/css/global-styles.css | 254 ++++++++++++++++++ 1 file changed, 254 insertions(+) create mode 100644 users_microservice/src/main/resources/static/css/global-styles.css diff --git a/users_microservice/src/main/resources/static/css/global-styles.css b/users_microservice/src/main/resources/static/css/global-styles.css new file mode 100644 index 00000000..8042c783 --- /dev/null +++ b/users_microservice/src/main/resources/static/css/global-styles.css @@ -0,0 +1,254 @@ +:root { + --black: #000000; + --dark-grey: #111111; + --dark-orange: #e65100; + --light-orange: #ffb74d; + --light-green: #81c784; + --focus-green: #4caf50; + --pink: #ff69b4; + --light-grey: #1e1e1e; + --medium-grey: #2a2a2a; + --text-light: #e0e0e0; + --text-muted: #a0a0a0; + --nav-height: 70px; +} + +* { + box-sizing: border-box; +} + +body { + background-color: #0a0a0a; + color: var(--text-light); + font-family: 'Space Grotesk', system-ui, sans-serif; + line-height: 1.6; + scroll-behavior: smooth; + padding-top: var(--nav-height); + margin: 0; +} + +h1, h2, h3, h4 { + color: white; + font-weight: 700; +} + +section { + padding-top: 3.5rem; + padding-bottom: 4rem; +} + +.section-grey, +.section-medium { + border: 2px solid var(--pink); + border-radius: 12px; + background-color: var(--light-grey); + margin: 0 auto 2rem auto; + max-width: 1400px; + color: var(--text-light); +} + +.section-medium { + background-color: var(--medium-grey); +} + +.card { + background-color: #111111; + border: 2px solid var(--pink) !important; + border-radius: 10px; + color: var(--text-light); + transition: transform 0.2s ease, box-shadow 0.2s ease; +} + +.card h4 { + color: white; +} + +.card p { + color: var(--text-muted); +} + +.card:hover { + transform: translateY(-6px); + box-shadow: 0 12px 24px rgba(255, 105, 180, 0.25); +} + +.feature-img { + max-height: 160px; + object-fit: cover; + border-radius: 8px; + border: 1px solid var(--pink); + margin-bottom: 1.25rem; + width: 100%; +} + +.btn-black, +.btn-primary-custom { + background-color: white; + color: var(--black); + border: 2px solid white; + font-weight: 600; + transition: all 0.3s ease; +} + +.btn-black:hover, +.btn-primary-custom:hover { + background-color: var(--dark-orange); + color: white; + border-color: var(--dark-orange); + transform: translateY(-2px); + box-shadow: 0 8px 20px rgba(230, 81, 0, 0.4); +} + +.btn-login { + background-color: transparent; + color: var(--text-light); + border: 2px solid var(--text-light); + font-weight: 500; + transition: all 0.3s ease; + padding: 0.375rem 1rem; +} + +.btn-login:hover { + background-color: var(--dark-orange); + color: white; + border-color: var(--dark-orange); + transform: translateY(-2px); +} + +.btn-learn-more { + background-color: var(--light-orange); + color: var(--black); + border: 2px solid var(--focus-green); + font-weight: 600; + transition: all 0.3s ease; + box-shadow: 0 4px 12px rgba(129, 199, 132, 0.3); +} + +.btn-learn-more:hover { + background-color: #ff9800; + border-color: #388e3c; + color: white; + transform: translateY(-3px) scale(1.05); + box-shadow: 0 12px 28px rgba(76, 175, 80, 0.4); +} + +.btn-learn-more:focus { + outline: none; + box-shadow: 0 0 0 0.3rem rgba(76, 175, 80, 0.4); +} + +.nav-link { + color: white !important; + font-weight: 500; + position: relative; + padding-bottom: 0.6rem; + transition: color 0.25s ease; +} + +.nav-link:hover, +.nav-link.active { + color: var(--light-orange) !important; +} + +.nav-link::after { + content: ''; + position: absolute; + bottom: 0; + left: 5%; + width: 0; + height: 3px; + background-color: var(--light-orange); + border-radius: 3px; + transition: width 0.35s ease, left 0.35s ease; +} + +.nav-link.active::after, +.nav-link:hover::after { + width: 90%; + left: 5%; +} + +nav { + border-bottom: 3px solid var(--pink); + background-color: #111111; +} + +.hero { + min-height: 70vh; + display: flex; + align-items: center; + border-bottom: 4px solid var(--pink); + margin-bottom: 3rem; + padding: 5rem 0 4rem; + background-color: #0a0a0a; +} + +.hero-text h1 { + color: var(--light-orange); +} + +.hero-img img { + max-width: 100%; + height: auto; + border-radius: 16px; + border: 3px solid var(--pink); + box-shadow: 0 12px 32px rgba(0, 0, 0, 0.6); +} + +@media (max-width: 991px) { + .hero-text { + text-align: center; + margin-bottom: 3rem; + } + .hero-img { + text-align: center; + } +} + +/* Form styling in dark mode */ +.form-control { + background-color: #222; + color: white; + border: 1px solid #444; +} + +.form-control:focus { + border-color: var(--focus-green) !important; + box-shadow: 0 0 0 0.25rem rgba(76, 175, 80, 0.25) !important; + background-color: #222; + color: white; +} + +.form-label { + color: var(--text-light); +} + +.form-group:focus-within .form-label { + color: var(--focus-green) !important; +} + +/* Footer */ +footer { + background-color: #111111; + border-top: 4px solid var(--pink); + color: var(--text-muted); + padding: 3rem 0 2rem; +} + +footer p { + color: var(--text-muted); +} + +footer a { + color: var(--light-orange); +} + +/* Extra spacing helpers */ +.py-5 { + padding-top: 3rem !important; + padding-bottom: 3rem !important; +} + +.mt-5 { + margin-top: 3rem !important; +} \ No newline at end of file From dc9f96226a8c864cdec82e9a8ee0adc7d71f8d84 Mon Sep 17 00:00:00 2001 From: Sizolwakhe Leonard Mthimunye Date: Thu, 5 Mar 2026 00:25:26 +0200 Subject: [PATCH 06/10] add aa html structure --- .../resources/static/css/landing-page.css | 43 +++++++++++++++++++ 1 file changed, 43 insertions(+) create mode 100644 users_microservice/src/main/resources/static/css/landing-page.css diff --git a/users_microservice/src/main/resources/static/css/landing-page.css b/users_microservice/src/main/resources/static/css/landing-page.css new file mode 100644 index 00000000..51854bf1 --- /dev/null +++ b/users_microservice/src/main/resources/static/css/landing-page.css @@ -0,0 +1,43 @@ +/* css/landing.css */ + +.hero { + min-height: 80vh; + display: flex; + align-items: center; + background: linear-gradient(135deg, #0a0a0a 0%, #111111 100%); + border-bottom: 4px solid var(--pink); + text-align: center; + padding: 6rem 1rem 8rem; +} + +.hero h1 { + color: var(--light-orange); + font-size: clamp(2.8rem, 8vw, 5.5rem); + margin-bottom: 1.5rem; +} + +.hero .lead { + color: var(--text-muted); + font-size: 1.4rem; + max-width: 720px; + margin: 0 auto 2.5rem; +} + +.section-features { + padding: 6rem 1rem; +} + +.feature-card { + background: var(--light-grey); + border: 2px solid var(--pink); + border-radius: 12px; + padding: 2rem; + transition: all 0.3s ease; +} + +.feature-card:hover { + transform: translateY(-8px); + box-shadow: 0 16px 32px rgba(255, 105, 180, 0.18); +} + +/* ... add your other landing sections: CTA, testimonials, etc. ... */ \ No newline at end of file From 4f25684f0cc97f91e14d2299e05329c97cb09bd8 Mon Sep 17 00:00:00 2001 From: Sizolwakhe Leonard Mthimunye Date: Thu, 5 Mar 2026 00:25:52 +0200 Subject: [PATCH 07/10] add aa html structure --- .../templates/home/registration.html | 80 +------------------ 1 file changed, 2 insertions(+), 78 deletions(-) diff --git a/users_microservice/src/main/resources/templates/home/registration.html b/users_microservice/src/main/resources/templates/home/registration.html index 6b5ec708..da7d54d2 100644 --- a/users_microservice/src/main/resources/templates/home/registration.html +++ b/users_microservice/src/main/resources/templates/home/registration.html @@ -6,86 +6,10 @@ Alcohol Agent - Registration - From c6a0cb91209b3d1d545b2380285a1f319dbe76c3 Mon Sep 17 00:00:00 2001 From: Sizolwakhe Leonard Mthimunye Date: Thu, 5 Mar 2026 00:26:22 +0200 Subject: [PATCH 08/10] add aa html structure --- .../main/resources/templates/home/reset.html | 101 +----------------- 1 file changed, 3 insertions(+), 98 deletions(-) diff --git a/users_microservice/src/main/resources/templates/home/reset.html b/users_microservice/src/main/resources/templates/home/reset.html index 352f451e..e9370f85 100644 --- a/users_microservice/src/main/resources/templates/home/reset.html +++ b/users_microservice/src/main/resources/templates/home/reset.html @@ -10,103 +10,8 @@ - - + + @@ -135,7 +40,7 @@

Reset Password

From 3b1bd1b64a488fed9f714b7837ed34b803fba845 Mon Sep 17 00:00:00 2001 From: Sizolwakhe Leonard Mthimunye Date: Thu, 5 Mar 2026 00:26:44 +0200 Subject: [PATCH 09/10] add aa html structure --- .../static/css/reset-password-style.css | 64 +++++++++++++++++++ 1 file changed, 64 insertions(+) create mode 100644 users_microservice/src/main/resources/static/css/reset-password-style.css diff --git a/users_microservice/src/main/resources/static/css/reset-password-style.css b/users_microservice/src/main/resources/static/css/reset-password-style.css new file mode 100644 index 00000000..c0202485 --- /dev/null +++ b/users_microservice/src/main/resources/static/css/reset-password-style.css @@ -0,0 +1,64 @@ + +.hero { + min-height: 35vh; /* shorter than landing page */ + padding: 5rem 1rem 4rem; /* good breathing room top/bottom */ + margin-bottom: 2.5rem; + background-color: #0a0a0a; + border-bottom: 4px solid var(--pink); +} + +/* Force center in all directions */ +.hero { + display: flex !important; + align-items: center !important; + justify-content: center !important; + text-align: center !important; +} + +.hero .container { + max-width: 600px; /* prevents text from stretching too wide */ +} + +.hero h1 { + color: var(--light-orange); + font-size: 2.8rem; + margin-bottom: 1rem; + line-height: 1.1; +} + +.hero .lead { + font-size: 1.25rem; + max-width: 520px; + margin: 0 auto; + color: var(--text-muted); +} + +/* Mobile / smaller screens */ +@media (max-width: 576px) { + .hero { + min-height: 30vh; + padding: 4rem 1rem 3rem; + } + + .hero h1 { + font-size: 2.4rem; + } + + .hero .lead { + font-size: 1.1rem; + } +} + +/* Optional: make form container narrower & more centered */ +.section-grey { + max-width: 460px; /* tighter than default 1400px max */ + padding: 2.25rem 1.75rem; + margin: 0 auto 3rem auto; +} + +/* Optional: slightly larger button for better touch target */ +.btn-primary-custom { + padding: 0.75rem 1.5rem; + font-size: 1.05rem; +} + From 080775e67f7ecca00d121bd7fbfc3bf84b23b8bb Mon Sep 17 00:00:00 2001 From: Sizolwakhe Leonard Mthimunye Date: Thu, 5 Mar 2026 00:27:18 +0200 Subject: [PATCH 10/10] add aa html structure --- .../src/main/resources/static/css/sign-up.css | 64 +++++++++++++++++++ 1 file changed, 64 insertions(+) create mode 100644 users_microservice/src/main/resources/static/css/sign-up.css diff --git a/users_microservice/src/main/resources/static/css/sign-up.css b/users_microservice/src/main/resources/static/css/sign-up.css new file mode 100644 index 00000000..c0202485 --- /dev/null +++ b/users_microservice/src/main/resources/static/css/sign-up.css @@ -0,0 +1,64 @@ + +.hero { + min-height: 35vh; /* shorter than landing page */ + padding: 5rem 1rem 4rem; /* good breathing room top/bottom */ + margin-bottom: 2.5rem; + background-color: #0a0a0a; + border-bottom: 4px solid var(--pink); +} + +/* Force center in all directions */ +.hero { + display: flex !important; + align-items: center !important; + justify-content: center !important; + text-align: center !important; +} + +.hero .container { + max-width: 600px; /* prevents text from stretching too wide */ +} + +.hero h1 { + color: var(--light-orange); + font-size: 2.8rem; + margin-bottom: 1rem; + line-height: 1.1; +} + +.hero .lead { + font-size: 1.25rem; + max-width: 520px; + margin: 0 auto; + color: var(--text-muted); +} + +/* Mobile / smaller screens */ +@media (max-width: 576px) { + .hero { + min-height: 30vh; + padding: 4rem 1rem 3rem; + } + + .hero h1 { + font-size: 2.4rem; + } + + .hero .lead { + font-size: 1.1rem; + } +} + +/* Optional: make form container narrower & more centered */ +.section-grey { + max-width: 460px; /* tighter than default 1400px max */ + padding: 2.25rem 1.75rem; + margin: 0 auto 3rem auto; +} + +/* Optional: slightly larger button for better touch target */ +.btn-primary-custom { + padding: 0.75rem 1.5rem; + font-size: 1.05rem; +} +