diff options
Diffstat (limited to 'frontend/src/styles/mobile.css')
| -rw-r--r-- | frontend/src/styles/mobile.css | 108 |
1 files changed, 108 insertions, 0 deletions
diff --git a/frontend/src/styles/mobile.css b/frontend/src/styles/mobile.css index c1c524d..7d1f282 100644 --- a/frontend/src/styles/mobile.css +++ b/frontend/src/styles/mobile.css @@ -51,4 +51,112 @@ .makima-inline-icon { width: 16px; height: 16px; margin-left: 6px; } .makima-list { gap: 4px; } .makima-list li { font-size: 12px; line-height: 1.45; } + + /* ================== Professional Landing Page – Mobile ================== */ + + /* Compact header */ + .pro-header-content { + padding: 0.45rem 1rem; + } + + .pro-company-name { + font-size: 0.85rem; + letter-spacing: 0.12em; + } + + .pro-crane-logo { + height: 28px; + } + + /* Hide center heart on small screens to save space */ + .pro-header-center { + display: none; + } + + /* Full-width nav buttons */ + .pro-header-nav { + gap: 0.15rem; + } + + .pro-nav-link { + font-size: 0.7rem; + padding: 0.3rem 0.5rem; + } + + .pro-nav-login { + margin-left: 0.25rem; + } + + /* Hero – reduce heading size and padding */ + .pro-hero { + min-height: 85vh; + padding: 5rem 1.25rem 3rem; + } + + .pro-hero-headline { + font-size: clamp(1.4rem, 5.5vw, 2rem); + } + + .pro-hero-sub { + font-size: 0.9rem; + margin-bottom: 2rem; + } + + .pro-hero-tagline-jp { + font-size: 0.75rem; + letter-spacing: 0.35em; + } + + .pro-hero-cta { + flex-direction: column; + align-items: stretch; + } + + .pro-btn-primary, + .pro-btn-secondary { + width: 100%; + text-align: center; + justify-content: center; + } + + /* Stack cards to single column */ + .pro-content-grid { + grid-template-columns: 1fr; + padding: 0 1rem 3rem; + gap: 1.5rem; + } + + .pro-card-header { + padding: 1rem 1.25rem 0.6rem; + } + + .pro-card-body { + padding: 0.6rem 1.25rem 1.25rem; + } + + .pro-card-title { + font-size: 1rem; + } + + .pro-card-subtitle { + font-size: 0.88rem; + } + + .pro-card-text { + font-size: 0.8rem; + } + + .pro-makima-logo { + width: 48px; + height: 48px; + } + + /* Footer compact */ + .pro-footer { + padding: 1.25rem 1rem; + } + + .pro-footer-inner { + font-size: 0.7rem; + } } |
