fix footer section padding

This commit is contained in:
2026-06-25 17:10:35 +05:30
parent b233992f30
commit 7f6b42153a
11 changed files with 497 additions and 172 deletions

View File

@@ -1274,8 +1274,127 @@ main {
overflow-x: hidden;
}
.premium-footer-shell {
width: calc(100% - 24px);
max-width: 1800px;
margin: 32px auto 0;
}
@media (min-width: 768px) {
.premium-footer-shell {
width: calc(100% - 40px);
}
}
@media (min-width: 1024px) {
.premium-footer-shell {
width: calc(100% - 64px);
}
}
@media (min-width: 1440px) {
.premium-footer-shell {
width: calc(100% - 96px);
}
}
/* ─── Feature Cards (BusinessSection) ─── */
.feature-card {
display: flex;
flex-direction: column;
padding: 20px;
}
@media (min-width: 768px) {
.feature-card {
padding: 24px;
}
}
@media (min-width: 1280px) {
.feature-card {
padding: 32px;
}
}
.feature-card__top {
display: grid;
grid-template-columns: 52px minmax(0, 1fr);
column-gap: 14px;
align-items: start;
}
@media (min-width: 640px) {
.feature-card__top {
grid-template-columns: 72px minmax(0, 1fr);
column-gap: 20px;
}
}
.feature-card__icon {
width: 48px;
height: 48px;
flex-shrink: 0;
}
@media (min-width: 640px) {
.feature-card__icon {
width: 64px;
height: 64px;
}
}
.feature-card__icon span {
font-size: 24px !important;
}
@media (min-width: 640px) {
.feature-card__icon span {
font-size: 32px !important;
}
}
.feature-card__content {
min-width: 0;
max-width: none;
}
.feature-card h3 {
margin: 0;
max-width: 100%;
font-family: var(--font-display), sans-serif;
font-weight: 900;
font-size: clamp(20px, 2vw, 32px);
line-height: 1.12;
letter-spacing: -0.03em;
color: var(--brand-dark);
}
@media (min-width: 640px) {
.feature-card h3 {
font-size: clamp(24px, 2vw, 32px);
}
}
.feature-card p {
margin-top: 12px;
max-width: 100%;
font-size: 14px;
line-height: 1.55;
color: var(--on-surface-variant);
}
@media (min-width: 640px) {
.feature-card p {
margin-top: 16px;
font-size: 17px;
}
}
.feature-card__image {
margin-top: 24px;
width: 100%;
overflow: hidden;
border-radius: 1.25rem;
background-color: var(--brand-accent-light);
}