UI: unify H1 size, eyebrow style, card radius and hover transform
Visual consistency pass so every page feels familiar. H1 token (clamp(34px, 4vw, 56px) / line-height 1.05 / letter-spacing -0.04em): - typography.css: hero H1 was 50.2px fixed (with 40px/38px breakpoints). - BookingPage: was clamp(32px, 4vw, 52px). Service-, About-, Pricing-, Legal-page H1s already matched. Shared .eyebrow utility (typography.css): - 13px, green, uppercase, 700, 0.08em letter-spacing. - Replaces the bespoke .service-eyebrow (14px) and .instagram-kicker (11px green pill). - The yellow 28px .service-highlight-eyebrow now inherits the same utility — the eyebrow line is no longer competing with the H2 underneath. Local rule kept only for the bottom-margin override. Card border-radius unified to 28px: - sections.css .service-card: 20px → 28px - sections.css .value-card: 16px → 28px - sections.css .testimonial-card: 20px → 28px - TestimonialsSection .testimonial-stage: 24px → 28px - AboutPage .about-section-gradient + .about-contact-card: 36px → 28px - LegalPage .legal-card: 32px → 28px (mobile 24px → 28px) - InstagramSection .instagram-panel: 24px → 28px - PricingPage .meet-greet-prompt: 24px → 28px (mobile 20px → 28px) Modal dialogs left at 24px (different visual class — overlay, not inline content card). Card hover transform unified to translateY(-6px) scale(1.012): - sections.css .service-card: -6px / 1.01 → 1.012 - sections.css .value-card: -5px (no scale) → -6px / 1.012 - sections.css .testimonial-card: -4px (no scale) → -6px / 1.012 - ServiceLandingPage .service-plan-card / .service-benefit-card: -8px → -6px - PricingPage .pricing-plan-card: -8px → -6px - ServiceLandingPage .service-related-card already -6px / 1.012. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
@@ -102,7 +102,7 @@
|
||||
.about-section-gradient {
|
||||
margin: 0 24px 88px;
|
||||
padding: 40px 0;
|
||||
border-radius: 36px;
|
||||
border-radius: 28px;
|
||||
background: linear-gradient(180deg, #f5efe6 0%, #f9f6ef 100%);
|
||||
}
|
||||
|
||||
@@ -168,7 +168,7 @@
|
||||
}
|
||||
|
||||
.about-contact-card {
|
||||
border-radius: 36px;
|
||||
border-radius: 28px;
|
||||
background: #fff;
|
||||
padding: 42px 48px;
|
||||
box-shadow: 0 14px 34px rgba(17, 20, 24, 0.05);
|
||||
|
||||
Reference in New Issue
Block a user