diff --git a/ui/index.html b/ui/index.html deleted file mode 100644 index b97b98c..0000000 --- a/ui/index.html +++ /dev/null @@ -1,232 +0,0 @@ - - - - - - BIS SP-21 — Bureau of Indian Standards - - - - - - - - - - - -
-
-

Special Publication 21 · 2005

-

- Handbook of
Building Materials -

-

- 573 Indian Standards across 25 material categories —
- searchable, categorised, and ready to reference. -

-
- Search Standards - Browse Categories -
-
-
- 573 - IS Standards -
- -
- 25 - Material Categories -
- -
- 929 - Pages Indexed -
-
-
-
- - -
-
-

Find an IS Standard

-

Search by standard number, title, material, or keyword.

- - - -
- -
- -
-

Start typing to search, or browse by category.

-
-
-
-
- - -
-
-
-

25 Material Categories

-

Every building material section from SP‑21, indexed and searchable.

-
-
-
-
- - -
-
-
-
-

About SP‑21

-

India's Reference for Building Material Standards

-

- BIS Special Publication 21 consolidates all Indian Standards relevant to building and construction - materials — from Portland cement to wire ropes, sanitary fittings to structural steels. Published - by the Bureau of Indian Standards, it is the authoritative handbook used by architects, structural - engineers, contractors, and quality inspectors across the country. -

-

- This portal indexes the 2005 edition (929 pages) into 573 discrete IS standards with full-text - search, keyword extraction, and section-level retrieval — making the handbook accessible without - manual page-turning. -

- - Visit BIS Portal ↗ - -
-
-
- -

Instant Retrieval

-

Full-text search across all 573 standards with ranked results.

-
-
- -

Section-Level Detail

-

Scope, requirements, delivery conditions — all structured fields.

-
-
- -

25 Categories

-

Organised by BIS material sections, mirroring SP‑21's own structure.

-
-
- -

Official Source

-

Parsed directly from the BIS SP‑21 : 2005 authoritative edition.

-
-
-
-
-
- - - - - - - - - - diff --git a/ui/style.css b/ui/style.css deleted file mode 100644 index 4115247..0000000 --- a/ui/style.css +++ /dev/null @@ -1,889 +0,0 @@ -/* ───────────────────────────────────────────── - BIS SP-21 Design System - Government adaptation of Apple tile system - ───────────────────────────────────────────── */ - -/* ── Reset & Base ── */ -*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } - -:root { - /* Brand accent — saffron instead of Action Blue */ - --accent: #d4530a; - --accent-hover: #b8460a; - --accent-dark: #ff8c3a; /* brighter on dark tiles */ - --accent-focus: #e05a0f; - - /* Government navy for secondary emphasis */ - --navy: #003380; - --navy-light: #0052cc; - - /* Surfaces */ - --canvas: #ffffff; - --parchment: #f4f4f2; /* gov off-white — slightly warmer than Apple */ - --pearl: #fafaf8; - --tile-dark-1: #1a2230; /* deep navy-charcoal */ - --tile-dark-2: #1e2838; - --tile-dark-3: #161d28; - --surface-black: #0d1117; - - /* Text */ - --ink: #1c1c1e; - --ink-80: #2d2d30; - --ink-48: #6e6e73; - --on-dark: #ffffff; - --on-dark-muted: #b8c0cc; - --body-muted: #8a8a8f; - - /* Borders */ - --hairline: #d8d8dc; - --divider: #ebebed; - - /* Category pill bg on card */ - --chip-bg: rgba(212, 83, 10, 0.08); - --chip-text: #b8460a; - - /* Typography — system-ui resolves to SF Pro on Apple, Segoe on Windows */ - --font-display: "SF Pro Display", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif; - --font-text: "SF Pro Text", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif; - - /* Radius */ - --r-xs: 4px; - --r-sm: 8px; - --r-md: 12px; - --r-lg: 18px; - --r-pill: 9999px; - - /* Spacing */ - --sp-xxs: 4px; - --sp-xs: 8px; - --sp-sm: 12px; - --sp-md: 18px; - --sp-lg: 24px; - --sp-xl: 32px; - --sp-xxl: 48px; - --sp-sec: 80px; - - /* Nav */ - --nav-h: 48px; - - /* Transitions */ - --ease: cubic-bezier(.4,0,.2,1); -} - -html { scroll-behavior: smooth; } - -body { - font-family: var(--font-text); - font-size: 17px; - font-weight: 400; - line-height: 1.47; - letter-spacing: -0.374px; - color: var(--ink); - background: var(--canvas); - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} - -/* ─── Tiles ─────────────────────────────── */ -.tile { - width: 100%; - padding: var(--sp-sec) 0; -} -.tile-light { background: var(--canvas); } -.tile-parchment{ background: var(--parchment); } -.tile-dark { background: var(--tile-dark-1); } -.tile-dark-2 { background: var(--tile-dark-2); } -.hero-tile { padding: 96px 0 80px; } - -.tile-inner { - max-width: 1100px; - margin: 0 auto; - padding: 0 40px; -} -.tile-center { text-align: center; } - -/* ─── Global Nav ─────────────────────────── */ -.global-nav { - position: sticky; - top: 0; - z-index: 200; - background: var(--surface-black); - height: var(--nav-h); - display: flex; - align-items: center; - border-bottom: 1px solid rgba(255,255,255,0.07); -} -.nav-inner { - width: 100%; - max-width: 1200px; - margin: 0 auto; - padding: 0 32px; - display: flex; - align-items: center; - gap: var(--sp-lg); -} -.nav-emblem { - display: flex; - align-items: center; - gap: 10px; - text-decoration: none; - flex-shrink: 0; -} -.emblem-icon { width: 28px; height: 28px; } -.nav-brand { - font-family: var(--font-display); - font-size: 15px; - font-weight: 600; - letter-spacing: 0.2px; - color: var(--on-dark); - white-space: nowrap; -} -.nav-links { - display: flex; - align-items: center; - gap: 4px; - margin-left: auto; -} -.nav-link { - font-family: var(--font-text); - font-size: 12px; - font-weight: 400; - letter-spacing: -0.12px; - color: rgba(255,255,255,0.85); - text-decoration: none; - padding: 6px 10px; - border-radius: var(--r-pill); - transition: color .15s var(--ease), background .15s var(--ease); -} -.nav-link:hover { color: #fff; background: rgba(255,255,255,0.08); } -.nav-hamburger { - display: none; - flex-direction: column; - gap: 5px; - background: none; - border: none; - cursor: pointer; - padding: 6px; - margin-left: auto; -} -.nav-hamburger span { - display: block; - width: 22px; - height: 2px; - background: var(--on-dark); - border-radius: 2px; - transition: transform .2s var(--ease), opacity .2s var(--ease); -} -.nav-hamburger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); } -.nav-hamburger[aria-expanded="true"] span:nth-child(2) { opacity: 0; } -.nav-hamburger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); } - -/* Mobile menu */ -.mobile-menu { - position: sticky; - top: var(--nav-h); - z-index: 190; - background: var(--tile-dark-3); - display: none; - flex-direction: column; - border-bottom: 1px solid rgba(255,255,255,0.08); -} -.mobile-menu.open { display: flex; } -.mobile-link { - display: block; - padding: 14px 32px; - color: rgba(255,255,255,0.87); - text-decoration: none; - font-size: 15px; - border-bottom: 1px solid rgba(255,255,255,0.06); - transition: background .15s; -} -.mobile-link:hover { background: rgba(255,255,255,0.05); } - -/* ─── Typography ─────────────────────────── */ -.hero-display { - font-family: var(--font-display); - font-size: clamp(36px, 6vw, 56px); - font-weight: 600; - line-height: 1.07; - letter-spacing: -0.5px; - color: var(--on-dark); - margin: 12px 0 20px; -} -.tile-eyebrow { - font-family: var(--font-text); - font-size: 12px; - font-weight: 600; - letter-spacing: 0.8px; - text-transform: uppercase; - color: var(--accent-dark); - margin-bottom: 8px; -} -.display-lg { - font-family: var(--font-display); - font-size: clamp(28px, 4vw, 40px); - font-weight: 600; - line-height: 1.1; - letter-spacing: -0.3px; - color: var(--ink); -} -.tile-dark .display-lg, -.tile-dark-2 .display-lg { color: var(--on-dark); } - -.display-md { - font-family: var(--font-text); - font-size: clamp(24px, 3vw, 34px); - font-weight: 600; - line-height: 1.18; - letter-spacing: -0.374px; - color: var(--on-dark); - margin-bottom: 20px; -} -.lead { - font-family: var(--font-display); - font-size: clamp(18px, 2.5vw, 24px); - font-weight: 400; - line-height: 1.4; - letter-spacing: 0; - color: var(--on-dark-muted); - margin-bottom: 32px; -} -.lead-sub { - font-family: var(--font-text); - font-size: 17px; - font-weight: 400; - line-height: 1.47; - letter-spacing: -0.374px; - color: var(--ink-48); - margin: 8px 0 28px; -} -.body-copy { - font-size: 17px; - line-height: 1.6; - letter-spacing: -0.374px; - color: var(--on-dark-muted); - margin-bottom: 16px; -} -.desktop-only { display: inline; } - -/* ─── Buttons ────────────────────────────── */ -.btn-primary { - display: inline-flex; - align-items: center; - gap: 6px; - background: var(--accent); - color: #fff; - font-family: var(--font-text); - font-size: 17px; - font-weight: 400; - line-height: 1; - letter-spacing: -0.374px; - text-decoration: none; - padding: 11px 24px; - border-radius: var(--r-pill); - border: none; - cursor: pointer; - transition: background .15s var(--ease), transform .1s var(--ease), box-shadow .15s var(--ease); - white-space: nowrap; -} -.btn-primary:hover { background: var(--accent-hover); } -.btn-primary:active { transform: scale(.96); } -.btn-primary:focus-visible { outline: 2px solid var(--accent-focus); outline-offset: 2px; } - -.btn-ghost-dark { - display: inline-flex; - align-items: center; - background: transparent; - color: var(--accent-dark); - font-family: var(--font-text); - font-size: 17px; - font-weight: 400; - line-height: 1; - letter-spacing: -0.374px; - text-decoration: none; - padding: 10px 24px; - border-radius: var(--r-pill); - border: 1.5px solid var(--accent-dark); - cursor: pointer; - transition: background .15s var(--ease), transform .1s var(--ease); -} -.btn-ghost-dark:hover { background: rgba(255,140,58,0.1); } -.btn-ghost-dark:active { transform: scale(.96); } - -.btn-primary-on-dark { - display: inline-flex; - align-items: center; - background: var(--accent-dark); - color: var(--surface-black); - font-family: var(--font-text); - font-size: 15px; - font-weight: 600; - text-decoration: none; - padding: 11px 24px; - border-radius: var(--r-pill); - border: none; - cursor: pointer; - transition: background .15s var(--ease), transform .1s var(--ease); - margin-top: 8px; -} -.btn-primary-on-dark:hover { background: #ffaa5c; } -.btn-primary-on-dark:active { transform: scale(.96); } - -.cta-row { - display: flex; - align-items: center; - gap: 12px; - justify-content: center; - flex-wrap: wrap; - margin-bottom: 48px; -} - -/* ─── Hero Stats ─────────────────────────── */ -.hero-stats { - display: inline-flex; - align-items: center; - gap: 32px; - background: rgba(255,255,255,0.05); - border: 1px solid rgba(255,255,255,0.1); - border-radius: var(--r-lg); - padding: 20px 36px; -} -.stat { text-align: center; } -.stat-num { - display: block; - font-family: var(--font-display); - font-size: 28px; - font-weight: 600; - color: var(--accent-dark); - line-height: 1; -} -.stat-label { - display: block; - font-size: 12px; - font-weight: 400; - color: var(--on-dark-muted); - margin-top: 4px; - letter-spacing: 0; -} -.stat-divider { - width: 1px; - height: 36px; - background: rgba(255,255,255,0.12); -} - -/* ─── Search ─────────────────────────────── */ -.search-form { width: 100%; max-width: 700px; margin: 0 auto; } -.search-wrap { - position: relative; - display: flex; - align-items: center; -} -.search-icon { - position: absolute; - left: 16px; - width: 18px; - height: 18px; - color: var(--ink-48); - pointer-events: none; - flex-shrink: 0; -} -.search-input { - width: 100%; - font-family: var(--font-text); - font-size: 17px; - font-weight: 400; - line-height: 1; - letter-spacing: -0.374px; - color: var(--ink); - background: var(--canvas); - border: 1.5px solid var(--hairline); - border-radius: var(--r-pill); - padding: 13px 48px 13px 44px; - outline: none; - transition: border-color .15s var(--ease), box-shadow .15s var(--ease); - -webkit-appearance: none; -} -.search-input:focus { - border-color: var(--accent); - box-shadow: 0 0 0 3px rgba(212,83,10,0.12); -} -.search-input::placeholder { color: var(--body-muted); } -/* hide native clear button */ -.search-input::-webkit-search-cancel-button { -webkit-appearance: none; } - -.search-clear { - position: absolute; - right: 14px; - background: none; - border: none; - cursor: pointer; - color: var(--ink-48); - font-size: 14px; - padding: 4px; - line-height: 1; - border-radius: 50%; - transition: background .15s, color .15s; -} -.search-clear:hover { background: var(--divider); color: var(--ink); } - -.filter-row { - display: flex; - align-items: center; - gap: 12px; - margin-top: 12px; -} -.category-filter { - flex: 1; - font-family: var(--font-text); - font-size: 14px; - font-weight: 400; - color: var(--ink); - background: var(--canvas); - border: 1.5px solid var(--hairline); - border-radius: var(--r-sm); - padding: 10px 14px; - outline: none; - cursor: pointer; - transition: border-color .15s var(--ease); -} -.category-filter:focus { border-color: var(--accent); } -.search-btn { padding: 10px 24px; font-size: 15px; } - -/* ─── Results ────────────────────────────── */ -.results-shell { - margin-top: 40px; - text-align: left; -} -.results-meta { - font-size: 13px; - color: var(--ink-48); - margin-bottom: 16px; - letter-spacing: 0; -} -.results-grid { - display: grid; - grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); - gap: 16px; -} -.results-empty, .results-initial { - text-align: center; - padding: 48px 0; - color: var(--ink-48); -} -.empty-title { - font-size: 17px; - font-weight: 600; - color: var(--ink-80); - margin-bottom: 6px; -} -.empty-sub { font-size: 14px; } - -/* Result Card */ -.result-card { - background: var(--canvas); - border: 1px solid var(--hairline); - border-radius: var(--r-lg); - padding: var(--sp-lg); - cursor: pointer; - transition: border-color .15s var(--ease), box-shadow .15s var(--ease), transform .1s var(--ease); - text-align: left; -} -.result-card:hover { - border-color: var(--accent); - box-shadow: 0 4px 24px rgba(212,83,10,0.08); - transform: translateY(-1px); -} -.result-card:active { transform: scale(.98); } -.result-card:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; } -.card-cat { - display: inline-block; - font-size: 11px; - font-weight: 600; - letter-spacing: 0.5px; - text-transform: uppercase; - color: var(--chip-text); - background: var(--chip-bg); - border-radius: var(--r-pill); - padding: 3px 10px; - margin-bottom: 8px; -} -.card-id { - font-family: var(--font-text); - font-size: 12px; - font-weight: 600; - color: var(--ink-48); - margin-bottom: 4px; - letter-spacing: 0; -} -.card-title { - font-family: var(--font-display); - font-size: 16px; - font-weight: 600; - line-height: 1.25; - letter-spacing: -0.2px; - color: var(--ink); - margin-bottom: 8px; -} -.card-summary { - font-size: 13px; - line-height: 1.5; - color: var(--ink-48); - display: -webkit-box; - -webkit-line-clamp: 3; - -webkit-box-orient: vertical; - overflow: hidden; -} -.card-keywords { - display: flex; - flex-wrap: wrap; - gap: 4px; - margin-top: 10px; -} -.keyword-chip { - font-size: 11px; - color: var(--ink-80); - background: var(--parchment); - border: 1px solid var(--divider); - border-radius: var(--r-pill); - padding: 2px 8px; -} -.card-footer { - display: flex; - align-items: center; - justify-content: space-between; - margin-top: 14px; - padding-top: 12px; - border-top: 1px solid var(--divider); -} -.card-sections-count { - font-size: 12px; - color: var(--ink-48); -} -.card-arrow { - color: var(--accent); - font-size: 14px; - font-weight: 600; -} - -/* ─── Category Grid ──────────────────────── */ -.section-header { text-align: center; margin-bottom: 48px; } -.section-header .lead-sub { max-width: 540px; margin: 8px auto 0; } - -.category-grid { - display: grid; - grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); - gap: 12px; -} -.cat-card { - background: var(--parchment); - border: 1px solid var(--divider); - border-radius: var(--r-lg); - padding: 20px var(--sp-lg); - cursor: pointer; - text-decoration: none; - display: flex; - flex-direction: column; - gap: 4px; - transition: border-color .15s var(--ease), box-shadow .15s var(--ease), transform .1s var(--ease); -} -.cat-card:hover { - border-color: var(--accent); - box-shadow: 0 4px 20px rgba(212,83,10,0.06); - transform: translateY(-1px); -} -.cat-card:active { transform: scale(.98); } -.cat-card:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; } -.cat-name { - font-family: var(--font-text); - font-size: 14px; - font-weight: 600; - line-height: 1.3; - letter-spacing: -0.2px; - color: var(--ink); -} -.cat-count { - font-size: 12px; - color: var(--accent); - font-weight: 500; -} - -/* ─── Feature / About ────────────────────── */ -.feature-cols { - display: grid; - grid-template-columns: 1fr 1fr; - gap: 64px; - align-items: start; -} -.feature-text .tile-eyebrow { margin-bottom: 12px; } -.feature-pillars { - display: grid; - grid-template-columns: 1fr 1fr; - gap: 24px; -} -.pillar { - background: rgba(255,255,255,0.04); - border: 1px solid rgba(255,255,255,0.08); - border-radius: var(--r-md); - padding: 20px; -} -.pillar-icon { font-size: 22px; display: block; margin-bottom: 10px; } -.pillar-title { - font-family: var(--font-text); - font-size: 14px; - font-weight: 600; - color: var(--on-dark); - margin-bottom: 6px; -} -.pillar-body { - font-size: 13px; - line-height: 1.5; - color: var(--on-dark-muted); -} - -/* ─── Modal ──────────────────────────────── */ -.modal-backdrop { - position: fixed; - inset: 0; - z-index: 400; - background: rgba(13,17,23,0.7); - backdrop-filter: blur(8px); - display: flex; - align-items: center; - justify-content: center; - padding: 24px; - animation: fadeIn .18s var(--ease); -} -.modal-backdrop[hidden] { display: none; } -@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } - -.modal { - background: var(--canvas); - border-radius: var(--r-lg); - width: 100%; - max-width: 680px; - max-height: 85vh; - overflow-y: auto; - animation: slideUp .2s var(--ease); - box-shadow: 0 20px 60px rgba(0,0,0,0.3); -} -@keyframes slideUp { from { transform: translateY(20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } } - -.modal-header { - display: flex; - align-items: flex-start; - justify-content: space-between; - gap: 16px; - padding: 28px 28px 20px; - border-bottom: 1px solid var(--divider); - position: sticky; - top: 0; - background: var(--canvas); - z-index: 1; -} -.modal-eyebrow { - display: block; - font-size: 11px; - font-weight: 600; - letter-spacing: 0.5px; - text-transform: uppercase; - color: var(--chip-text); - background: var(--chip-bg); - border-radius: var(--r-pill); - padding: 3px 10px; - margin-bottom: 8px; - width: fit-content; -} -.modal-title { - font-family: var(--font-display); - font-size: 22px; - font-weight: 600; - line-height: 1.2; - letter-spacing: -0.3px; - color: var(--ink); - margin-bottom: 4px; -} -.modal-id { - font-size: 13px; - font-weight: 600; - color: var(--ink-48); - letter-spacing: 0; -} -.modal-close { - flex-shrink: 0; - background: var(--parchment); - border: none; - border-radius: 50%; - width: 32px; - height: 32px; - display: flex; - align-items: center; - justify-content: center; - cursor: pointer; - color: var(--ink-48); - font-size: 14px; - transition: background .15s, color .15s; -} -.modal-close:hover { background: var(--divider); color: var(--ink); } - -.modal-body { padding: 24px 28px 32px; } -.modal-section { margin-bottom: 24px; } -.modal-section:last-child { margin-bottom: 0; } -.modal-section-title { - font-size: 11px; - font-weight: 600; - letter-spacing: 0.6px; - text-transform: uppercase; - color: var(--ink-48); - margin-bottom: 8px; -} -.modal-section-body { - font-size: 15px; - line-height: 1.6; - letter-spacing: -0.2px; - color: var(--ink-80); -} -.modal-keywords { - display: flex; - flex-wrap: wrap; - gap: 6px; -} -.modal-keyword { - font-size: 12px; - color: var(--ink-80); - background: var(--parchment); - border: 1px solid var(--divider); - border-radius: var(--r-pill); - padding: 4px 12px; -} -.modal-key-sections { display: flex; flex-direction: column; gap: 16px; } -.key-section-item { - background: var(--parchment); - border-radius: var(--r-md); - padding: 16px; - border-left: 3px solid var(--accent); -} -.key-section-name { - font-size: 12px; - font-weight: 600; - letter-spacing: 0.3px; - color: var(--accent); - text-transform: uppercase; - margin-bottom: 6px; -} -.key-section-text { - font-size: 14px; - line-height: 1.6; - color: var(--ink-80); -} - -/* ─── Inline link ────────────────────────── */ -.inline-link { - color: var(--accent); - text-decoration: underline; - text-underline-offset: 2px; -} -.inline-link:hover { color: var(--accent-hover); } - -/* ─── Footer ─────────────────────────────── */ -.footer { - background: var(--parchment); - border-top: 1px solid var(--divider); - padding: 60px 0 32px; -} -.footer-inner { - max-width: 1100px; - margin: 0 auto; - padding: 0 40px; -} -.footer-cols { - display: grid; - grid-template-columns: 1.5fr 1fr 1fr 1fr; - gap: 40px; - margin-bottom: 40px; -} -.footer-brand { - font-family: var(--font-display); - font-size: 17px; - font-weight: 600; - color: var(--ink); - margin-bottom: 6px; -} -.footer-tagline { - font-size: 13px; - color: var(--ink-48); - line-height: 1.5; -} -.footer-heading { - font-size: 13px; - font-weight: 600; - color: var(--ink-80); - margin-bottom: 10px; -} -.footer-link { - display: block; - font-size: 13px; - color: var(--ink-48); - text-decoration: none; - line-height: 2.2; - transition: color .12s; -} -.footer-link:hover { color: var(--accent); } -.footer-legal { - border-top: 1px solid var(--divider); - padding-top: 20px; - font-size: 11px; - color: var(--ink-48); - line-height: 1.7; -} -.footer-legal p + p { margin-top: 4px; } -.legal-link { - color: var(--ink-48); - text-decoration: underline; - text-underline-offset: 2px; -} -.legal-link:hover { color: var(--accent); } - -/* ─── Focus outline ──────────────────────── */ -*:focus-visible { - outline: 2px solid var(--accent); - outline-offset: 2px; -} - -/* ─── Responsive ─────────────────────────── */ -@media (max-width: 1023px) { - .feature-cols { grid-template-columns: 1fr; gap: 40px; } - .footer-cols { grid-template-columns: 1fr 1fr; gap: 28px; } -} - -@media (max-width: 833px) { - :root { --sp-sec: 56px; } - .nav-links { display: none; } - .nav-hamburger { display: flex; } - .hero-display { font-size: 34px; } - .feature-pillars { grid-template-columns: 1fr; } - .hero-stats { gap: 20px; padding: 16px 24px; } - .stat-num { font-size: 22px; } - .desktop-only { display: none; } -} - -@media (max-width: 640px) { - :root { --sp-sec: 48px; } - .tile-inner { padding: 0 20px; } - .nav-inner { padding: 0 20px; } - .hero-display { font-size: 28px; } - .lead { font-size: 17px; } - .hero-stats { flex-direction: column; gap: 12px; padding: 16px 20px; } - .stat-divider { width: 40px; height: 1px; } - .cta-row { flex-direction: column; align-items: stretch; } - .cta-row .btn-primary, .cta-row .btn-ghost-dark { text-align: center; justify-content: center; } - .filter-row { flex-direction: column; align-items: stretch; } - .footer-cols { grid-template-columns: 1fr; gap: 24px; } - .modal { border-radius: var(--r-md) var(--r-md) 0 0; max-height: 90vh; } - .modal-backdrop { align-items: flex-end; padding: 0; } - .footer-inner { padding: 0 20px; } -} - -@media (max-width: 419px) { - .hero-display { font-size: 24px; } - .display-lg { font-size: 22px; } -}