18042026 index query

This commit is contained in:
2026-04-18 17:20:24 +05:30
parent 786bd38286
commit 098c3387c8
39 changed files with 5567 additions and 1509 deletions

View File

@@ -313,273 +313,45 @@
}
/* ─── LARGE DESKTOP (1440px+) ─── */
@media (min-width: 1440px) {
.dm-compare-section {
max-width: 1260px;
padding: 60px 52px 0px;
}
.dm-compare-section::before {
background-size: 80px 80px;
}
.dm-compare-section .dm-section-header {
margin-bottom: 64px;
}
.dm-compare-section .dm-eyebrow {
font-size: 12px;
letter-spacing: 3.8px;
gap: 12px;
margin-bottom: 20px;
}
.dm-compare-section .dm-eyebrow::before,
.dm-compare-section .dm-eyebrow::after {
width: 32px;
}
.dm-compare-section .dm-section-title {
font-size: clamp(40px, 5vw, 68px);
letter-spacing: -1.1px;
}
.dm-compare-section .dm-section-sub {
font-size: 16px;
margin-top: 20px;
line-height: 1.72;
}
.dm-compare-section .dm-compare-wrap {
border-radius: 24px;
}
.dm-compare-section .dm-col-head {
padding: 30px 44px;
font-size: 13.5px;
letter-spacing: 2.8px;
gap: 12px;
}
.dm-compare-section .dm-col-head-icon {
width: 30px;
height: 30px;
border-radius: 9px;
}
.dm-compare-section .dm-col-head-icon svg {
width: 15px;
height: 15px;
}
.dm-compare-section .dm-cell {
padding: 30px 44px;
gap: 18px;
font-size: 15.5px;
}
.dm-compare-section .dm-cell-icon {
width: 34px;
height: 34px;
}
.dm-compare-section .dm-cell-icon svg {
width: 16px;
height: 16px;
}
.dm-compare-section .dm-footer-cell {
padding: 24px 44px;
font-size: 12.5px;
letter-spacing: 1.8px;
}
/* ─── DESKTOP (1200px) ─── */
@media (max-width: 1200px) {
.dm-compare-section { max-width: 960px; padding: 50px 30px 0; }
.dm-compare-section .dm-section-title { font-size: 52px; }
}
/* ─── EXTRA-LARGE DESKTOP (1920px+) ─── */
@media (min-width: 1920px) {
.dm-compare-section {
max-width: 1480px;
padding: 72px 64px 0px;
}
.dm-compare-section::before {
background-size: 90px 90px;
}
.dm-compare-section .dm-section-header {
margin-bottom: 72px;
}
.dm-compare-section .dm-eyebrow {
font-size: 13px;
letter-spacing: 4px;
gap: 13px;
margin-bottom: 22px;
}
.dm-compare-section .dm-eyebrow::before,
.dm-compare-section .dm-eyebrow::after {
width: 36px;
}
.dm-compare-section .dm-section-title {
font-size: clamp(46px, 5vw, 76px);
letter-spacing: -1.3px;
}
.dm-compare-section .dm-section-sub {
font-size: 17px;
margin-top: 22px;
line-height: 1.75;
}
.dm-compare-section .dm-compare-wrap {
border-radius: 26px;
box-shadow: 0 10px 60px rgba(0,0,0,0.1);
}
.dm-compare-section .dm-col-head {
padding: 32px 52px;
font-size: 14px;
letter-spacing: 3px;
gap: 13px;
}
.dm-compare-section .dm-col-head-icon {
width: 32px;
height: 32px;
border-radius: 10px;
}
.dm-compare-section .dm-col-head-icon svg {
width: 16px;
height: 16px;
}
.dm-compare-section .dm-cell {
padding: 34px 52px;
gap: 20px;
font-size: 16px;
}
.dm-compare-section .dm-cell-icon {
width: 36px;
height: 36px;
}
.dm-compare-section .dm-cell-icon svg {
width: 17px;
height: 17px;
}
.dm-compare-section .dm-footer-cell {
padding: 26px 52px;
font-size: 13px;
letter-spacing: 2px;
}
/* ─── TABLET (1024px) ─── */
@media (max-width: 1024px) {
.dm-compare-section { max-width: 100%; padding: 50px 40px; }
.dm-compare-section .dm-section-title { font-size: 46px; }
.dm-compare-section .dm-col-head,
.dm-compare-section .dm-cell { padding: 25px 30px; }
.dm-compare-section .dm-section-sub { font-size: 15px; }
}
/* ─── ULTRA-WIDE (2560px+) ─── */
@media (min-width: 2560px) {
.dm-compare-section {
max-width: 1760px;
padding: 80px 72px 0px;
}
.dm-compare-section::before {
background-size: 100px 100px;
}
.dm-compare-section .dm-section-header {
margin-bottom: 84px;
}
.dm-compare-section .dm-eyebrow {
font-size: 14px;
letter-spacing: 4.5px;
gap: 14px;
margin-bottom: 26px;
}
.dm-compare-section .dm-eyebrow::before,
.dm-compare-section .dm-eyebrow::after {
width: 42px;
}
.dm-compare-section .dm-section-title {
font-size: clamp(52px, 5vw, 84px);
letter-spacing: -1.5px;
}
.dm-compare-section .dm-section-sub {
font-size: 18.5px;
margin-top: 26px;
line-height: 1.8;
}
.dm-compare-section .dm-compare-wrap {
border-radius: 28px;
box-shadow: 0 12px 70px rgba(0,0,0,0.1);
}
.dm-compare-section .dm-col-head {
padding: 36px 60px;
font-size: 15px;
letter-spacing: 3.5px;
gap: 14px;
}
.dm-compare-section .dm-col-head-icon {
width: 36px;
height: 36px;
border-radius: 11px;
}
.dm-compare-section .dm-col-head-icon svg {
width: 18px;
height: 18px;
}
.dm-compare-section .dm-cell {
padding: 38px 60px;
gap: 22px;
font-size: 17px;
line-height: 1.55;
}
.dm-compare-section .dm-cell-icon {
width: 40px;
height: 40px;
}
.dm-compare-section .dm-cell-icon svg {
width: 19px;
height: 19px;
}
.dm-compare-section .dm-footer-cell {
padding: 28px 60px;
font-size: 14px;
letter-spacing: 2.2px;
}
.dm-compare-section .dm-footer-cell .dm-dot {
width: 8px;
height: 8px;
}
/* ─── MOBILE (768px) ─── */
@media (max-width: 768px) {
.dm-compare-section { padding: 60px 20px 80px; }
.dm-compare-section .dm-section-header { margin-bottom: 40px; }
.dm-compare-section .dm-section-title { font-size: 38px; }
.dm-compare-section .dm-section-sub { font-size: 14.5px; margin-top: 15px; }
.dm-compare-section .dm-col-head { padding: 20px 20px; font-size: 11.5px; letter-spacing: 2px; }
.dm-compare-section .dm-cell { padding: 22px 20px; font-size: 14px; gap: 12px; }
.dm-compare-section .dm-cell-icon { width: 28px; height: 28px; }
.dm-compare-section .dm-footer-cell { padding: 18px 20px; font-size: 11px; letter-spacing: 1px; }
}
/* ── RESPONSIVE (MOBILE) ── */
@media (max-width: 680px) {
.dm-compare-section { padding: 60px 16px 70px; }
.dm-compare-section .dm-col-head,
.dm-compare-section .dm-cell { padding: 20px 20px; }
.dm-compare-section .dm-footer-cell { padding: 18px 20px; }
.dm-compare-section .dm-col-head { font-size: 11px; letter-spacing: 1.5px; }
/* ─── SMALL PHONE (480px) ── */
@media (max-width: 480px) {
.dm-compare-section { padding: 50px 15px 60px; }
.dm-compare-section .dm-eyebrow { font-size: 10px; letter-spacing: 2.5px; }
.dm-compare-section::before { background-size: 50px 50px; }
.dm-compare-section .dm-section-title { font-size: 32px; letter-spacing: -0.5px; }
.dm-compare-section .dm-col-head { padding: 18px 15px; font-size: 10px; letter-spacing: 1px; gap: 8px; }
.dm-compare-section .dm-col-head-icon { width: 22px; height: 22px; }
.dm-compare-section .dm-cell { padding: 18px 12px; font-size: 13px; gap: 10px; }
.dm-compare-section .dm-cell-icon { width: 24px; height: 24px; }
.dm-compare-section .dm-footer-cell { padding: 15px 12px; font-size: 9px; letter-spacing: 0.5px; }
.dm-compare-section .dm-footer-cell.dm-right { gap: 6px; }
}
</style>