/* ============================================
   MOJEDATOVKA.CZ — AI Design System (REFERENCE MATCH)
   Colors: #0A1F44 (deep navy), #FFD166 (yellow), #6B7280 (muted gray)
   Font: Inter fallback stack
   ============================================ */

/* ── Reset & Base ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
    --md-blue: #0A1F44;
    --md-blue-hover: #1E3A8A;
    --md-blue-deep: #0A1F44;
    --md-yellow: #FFD166;
    --md-yellow-hover: #F5C542;
    --md-bg: #F8F9FA;
    --md-border: #E5E7EB;
    --md-muted: #6B7280;
    --md-white: #FFFFFF;
    --md-green: #10B981;
    --md-green-light: #D1FAE5;
    --md-green-text: #065F46;
    --md-red: #DC2626;
    --container-max: 1200px;
    --container-px: 24px;
    --container-px-lg: 48px;
}

html, body {
    background: var(--md-bg);
    margin: 0;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: var(--md-blue-deep);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1.6;
}

body { min-height: 100vh; display: flex; flex-direction: column; }

a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; display: block; }
ul { list-style: none; }

.container {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 var(--container-px);
}

@media (min-width: 1024px) {
    .container { padding: 0 var(--container-px-lg); }
}

/* ── Typography ── */
.font-display {
    font-family: 'Inter', sans-serif;
    letter-spacing: -0.025em;
}

.mono {
    font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

.stat-tick {
    font-variant-numeric: tabular-nums;
}

/* ── Section Numbers ── */
.section-number {
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--md-muted);
    margin-bottom: 8px;
    display: block;
}

.section-number::before {
    content: '—';
    margin-right: 8px;
    color: var(--md-blue-deep);
}

.section-number-highlight {
    color: var(--md-yellow);
}

/* ── Page Header ── */
.page-header {
    margin-bottom: 40px;
}

.page-header h1 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 48px;
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: var(--md-blue-deep);
    margin-bottom: 12px;
}

.page-header p {
    font-size: 16px;
    color: var(--md-muted);
    line-height: 1.5;
    max-width: 700px;
}

.page-header-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
}

.page-header-row h1 {
    flex: 1;
}

.page-header-row .page-header-link {
    font-size: 14px;
    font-weight: 500;
    color: var(--md-blue);
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 4px;
}

.page-header-row .page-header-link:hover {
    color: var(--md-yellow);
}

/* ── Header ── */
.header-top {
    background: var(--md-blue-deep);
    color: var(--md-white);
}

.header-top-inner {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 24px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 11px;
    font-family: 'JetBrains Mono', monospace;
    text-transform: uppercase;
    letter-spacing: 0.16em;
}

.header-top-left {
    display: flex;
    align-items: center;
    gap: 24px;
}

.header-top-left .live-dot {
    width: 6px;
    height: 6px;
    background: var(--md-yellow);
    display: inline-block;
}

.header-top-right {
    display: flex;
    align-items: center;
    gap: 20px;
}

.header-top-right a {
    color: rgba(255,255,255,0.7);
    transition: color 0.2s;
}

.header-top-right a:hover {
    color: var(--md-yellow);
}

.header-main {
    background: var(--md-white);
    border-bottom: 1px solid var(--md-border);
    position: sticky;
    top: 0;
    z-index: 50;
}

.header-main-inner {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 24px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
}

/* Logo */
.logo {
    display: flex;
    align-items: center;
    gap: 12px;
}

.logo-icon {
    position: relative;
    width: 44px;
    height: 44px;
    background: var(--md-blue-deep);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.logo-icon span {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 17px;
    color: var(--md-yellow);
    line-height: 1;
}

.logo-icon::after {
    content: '';
    position: absolute;
    bottom: -4px;
    right: -4px;
    width: 12px;
    height: 12px;
    background: var(--md-yellow);
}

.logo-text {
    line-height: 1.15;
}

.logo-main {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 15px;
    letter-spacing: -0.02em;
    color: var(--md-blue-deep);
}

.logo-sub {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--md-muted);
}

/* Desktop Nav */
.nav-desktop {
    display: none;
}

@media (min-width: 1024px) {
    .nav-desktop {
        display: flex;
        align-items: center;
        gap: 32px;
    }
}

.nav-desktop a {
    font-size: 13.5px;
    font-weight: 500;
    letter-spacing: -0.01em;
    color: var(--md-blue-deep);
    transition: color 0.2s;
    position: relative;
}

.nav-desktop a::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -4px;
    width: 100%;
    height: 1px;
    background: currentColor;
    transform-origin: right;
    transform: scaleX(0);
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.nav-desktop a:hover::after,
.nav-desktop a.active::after {
    transform-origin: left;
    transform: scaleX(1);
}

.nav-desktop a:hover,
.nav-desktop a.active {
    color: var(--md-blue);
}

/* Header Right */
.header-right {
    display: none;
    align-items: center;
    gap: 12px;
}

@media (min-width: 1024px) {
    .header-right {
        display: flex;
    }
}

.header-search-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 12px;
    height: 40px;
    border: 1px solid var(--md-border);
    border-radius: 4px;
    font-size: 13px;
    transition: border-color 0.2s;
}

.header-search-btn:hover {
    border-color: var(--md-blue-deep);
}

.header-search-btn .search-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--md-muted);
}

.header-search-btn kbd {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    padding: 2px 6px;
    background: var(--md-bg);
    color: var(--md-muted);
}

.header-cta {
    background: var(--md-yellow);
    color: var(--md-blue-deep);
    font-weight: 700;
    padding: 0 20px;
    height: 40px;
    display: flex;
    align-items: center;
    font-size: 13px;
    transition: background 0.2s;
}

.header-cta:hover {
    background: var(--md-yellow-hover);
}

/* Mobile menu */
.mobile-menu-btn {
    display: block;
    background: none;
    border: 1px solid var(--md-border);
    padding: 8px;
    cursor: pointer;
}

@media (min-width: 1024px) {
    .mobile-menu-btn { display: none; }
}

.nav-mobile {
    display: none;
    border-top: 1px solid var(--md-border);
    background: var(--md-white);
    padding: 24px;
}

.nav-mobile.open {
    display: block;
}

.nav-mobile a {
    display: block;
    padding: 12px 0;
    font-weight: 500;
    color: var(--md-blue-deep);
    border-bottom: 1px solid var(--md-border);
}

.nav-mobile a:last-child {
    border-bottom: none;
}

.nav-mobile .mobile-cta {
    display: block;
    text-align: center;
    background: var(--md-yellow);
    color: var(--md-blue-deep);
    font-weight: 700;
    padding: 14px;
    margin-top: 16px;
}

/* ── Hero Section ── */
.hero-section {
    position: relative;
    background: var(--md-white);
    border-bottom: 1px solid var(--md-border);
    overflow: hidden;
}

.hero-pinstripe {
    position: absolute;
    inset: 0;
    background-image: repeating-linear-gradient(
        90deg,
        rgba(22, 31, 92, 0.045) 0px,
        rgba(22, 31, 92, 0.045) 1px,
        transparent 1px,
        transparent 80px
    );
    opacity: 0.6;
    pointer-events: none;
}

.hero-stamp {
    position: absolute;
    right: 24px;
    top: 24px;
    z-index: 10;
    display: none;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
}

@media (min-width: 768px) {
    .hero-stamp { display: flex; }
}

.hero-stamp-badge {
    border: 2px solid var(--md-blue);
    color: var(--md-blue);
    padding: 6px 12px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    font-weight: 700;
}

.hero-stamp-sub {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    color: var(--md-muted);
    text-transform: uppercase;
    letter-spacing: 0.18em;
}

.hero-inner {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 48px 24px 40px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
    align-items: start;
}

@media (min-width: 1024px) {
    .hero-inner {
        padding: 64px 48px 48px;
        grid-template-columns: 1fr 1fr;
        gap: 64px;
    }
}

.hero-left {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.hero-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 40px;
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: var(--md-blue-deep);
}

@media (min-width: 768px) {
    .hero-title { font-size: 48px; }
}

@media (min-width: 1024px) {
    .hero-title { font-size: 56px; }
}

.hero-title .highlight {
    position: relative;
    display: inline;
}

.hero-title .highlight::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 2px;
    right: 0;
    height: 8px;
    background: var(--md-yellow);
    z-index: -1;
    opacity: 0.8;
}

.hero-desc {
    font-size: 16px;
    line-height: 1.6;
    color: var(--md-muted);
    max-width: 480px;
}

.hero-desc strong {
    color: var(--md-blue-deep);
    font-weight: 700;
}

.hero-right {
    display: flex;
    flex-direction: column;
    gap: 0;
}

@media (min-width: 1024px) {
    .hero-right {
        position: sticky;
        top: 120px;
    }
}

/* Hero Search */
.hero-search {
    margin-top: 0;
    max-width: 100%;
}

.hero-search-tabs {
    display: flex;
    gap: 0;
    margin-bottom: 12px;
    border-bottom: 2px solid var(--md-border);
}

.hero-search-tab {
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    font-weight: 500;
    color: var(--md-muted);
    padding: 8px 16px;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: color 0.2s, border-color 0.2s;
}

.hero-search-tab.active {
    color: var(--md-blue-deep);
    border-bottom-color: var(--md-blue-deep);
}

.hero-search-tab:hover {
    color: var(--md-blue-deep);
}

.hero-search-form {
    display: flex;
    border: 2px solid var(--md-blue-deep);
    background: var(--md-white);
    height: 56px;
}

.hero-search-label {
    display: none;
    align-items: center;
    padding: 0 20px;
    border-right: 1px solid rgba(10, 31, 68, 0.1);
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--md-muted);
}

@media (min-width: 768px) {
    .hero-search-label { display: flex; }
}

.hero-search-input {
    flex: 1;
    padding: 0 20px;
    height: 56px;
    border: none;
    outline: none;
    font-size: 15px;
    font-weight: 400;
    font-family: 'Inter', sans-serif;
    color: var(--md-blue-deep);
}

.hero-search-input::placeholder {
    color: var(--md-muted);
}

@media (min-width: 768px) {
    .hero-search-input { font-size: 16px; }
}

.hero-search-btn {
    background: var(--md-blue);
    color: var(--md-white);
    padding: 0 32px;
    font-weight: 700;
    font-size: 15px;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: background 0.2s;
    font-family: 'Inter', sans-serif;
}

.hero-search-btn:hover {
    background: var(--md-blue-hover);
}

@media (min-width: 768px) {
    .hero-search-btn { padding: 0 40px; }
}

.hero-suggestions {
    margin-top: 16px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 24px;
    font-size: 13px;
    color: var(--md-muted);
    align-items: center;
}

.hero-suggestions .sug-label {
    font-family: 'JetBrains Mono', monospace;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--md-blue-deep);
    font-size: 12px;
}

.hero-suggestions a {
    font-family: 'Inter', sans-serif;
    transition: color 0.2s;
    color: var(--md-muted);
}

.hero-suggestions a:hover {
    color: var(--md-blue);
}

.hero-suggestions a::before {
    content: '›';
    color: var(--md-muted);
    margin-right: 2px;
    font-weight: 700;
}

/* Hero Stats Bar */
.hero-stats-bar {
    border-top: 2px solid var(--md-blue-deep);
    background: var(--md-bg);
}

.hero-stats-inner {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 32px 24px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}

@media (min-width: 768px) {
    .hero-stats-inner {
        grid-template-columns: repeat(4, 1fr);
        padding: 40px 48px;
    }
}

.hero-stat {
    padding: 0;
}

.hero-stat-accent {
    background: var(--md-yellow);
}

.hero-stat-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: var(--md-muted);
    margin-bottom: 8px;
}

.hero-stat-value {
    font-family: 'JetBrains Mono', monospace;
    font-weight: 700;
    font-size: 24px;
    color: var(--md-blue-deep);
    letter-spacing: -0.02em;
}

@media (min-width: 768px) {
    .hero-stat-value { font-size: 32px; }
}

/* ── Marquee ── */
.marquee-section {
    background: var(--md-blue-deep);
    color: var(--md-white);
    border-top: 1px solid var(--md-blue-deep);
    border-bottom: 1px solid var(--md-blue-deep);
    overflow: hidden;
    padding: 16px 0;
}

.marquee-track {
    display: flex;
    white-space: nowrap;
    animation: marquee 60s linear infinite;
}

@keyframes marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

.marquee-item {
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.22em;
    display: inline-flex;
    align-items: center;
    gap: 24px;
    padding: 0 24px;
}

.marquee-item .star {
    color: var(--md-yellow);
    font-size: 14px;
    margin: 0 12px;
}

/* ── Section Kicker ── */
.section-kicker {
    font-family: 'JetBrains Mono', monospace;
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 0.22em;
    color: var(--md-muted);
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 24px;
}

.section-kicker::before {
    content: '';
    width: 24px;
    height: 1px;
    background: var(--md-blue-deep);
}

/* ── Categories Section ── */
.categories-section {
    background: var(--md-bg);
    border-bottom: 1px solid var(--md-border);
}

.categories-inner {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 80px 24px;
}

@media (min-width: 1024px) {
    .categories-inner { padding: 80px 40px; }
}

.categories-header {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-bottom: 48px;
}

@media (min-width: 768px) {
    .categories-header {
        flex-direction: row;
        align-items: end;
        justify-content: space-between;
    }
}

.categories-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 48px;
    letter-spacing: -0.02em;
    line-height: 1.1;
    color: var(--md-blue-deep);
    max-width: 400px;
}

.categories-title .accent {
    color: var(--md-blue);
}

.categories-desc {
    font-size: 15px;
    color: var(--md-muted);
    max-width: 380px;
}

.categories-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

@media (min-width: 768px) {
    .categories-grid { grid-template-columns: repeat(3, 1fr); }
}

.category-card {
    display: block;
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 32px;
    position: relative;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s;
}

.category-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(10, 31, 68, 0.1);
}

.category-icon {
    color: var(--md-blue);
    margin-bottom: 32px;
}

.category-slug {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: var(--md-muted);
    margin-bottom: 8px;
}

.category-name {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 24px;
    color: var(--md-blue-deep);
    letter-spacing: -0.02em;
    margin-bottom: 12px;
}

.category-text {
    font-size: 14px;
    color: rgba(22, 31, 92, 0.7);
    line-height: 1.6;
    margin-bottom: 32px;
}

.category-footer {
    display: flex;
    align-items: end;
    justify-content: space-between;
    padding-top: 24px;
    border-top: 1px solid var(--md-border);
}

.category-count-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--md-muted);
}

.category-count-value {
    font-family: 'JetBrains Mono', monospace;
    font-weight: 700;
    font-size: 30px;
    color: var(--md-blue-deep);
    margin-top: 4px;
}

.category-arrow {
    color: var(--md-blue);
    transition: transform 0.2s;
}

.category-card:hover .category-arrow {
    transform: translateX(4px);
}

/* ── Registry Section ── */
.registry-section {
    background: var(--md-white);
    border-bottom: 1px solid var(--md-border);
}

.registry-inner {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 80px 24px;
}

@media (min-width: 1024px) {
    .registry-inner { padding: 80px 40px; }
}

.registry-header {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-bottom: 48px;
}

@media (min-width: 768px) {
    .registry-header {
        flex-direction: row;
        align-items: end;
        justify-content: space-between;
    }
}

.registry-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: clamp(28px, 4vw, 48px);
    letter-spacing: -0.02em;
    line-height: 1;
    color: var(--md-blue-deep);
    max-width: 600px;
}

.registry-title .muted {
    color: var(--md-muted);
}

.registry-live {
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: var(--md-muted);
}

.registry-live-dot {
    position: relative;
    width: 8px;
    height: 8px;
}

.registry-live-dot::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: var(--md-green);
}

.registry-live-dot::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: var(--md-green);
    opacity: 0.75;
    animation: ping 1.5s ease-in-out infinite;
}

@keyframes ping {
    0% { transform: scale(1); opacity: 0.75; }
    100% { transform: scale(2.5); opacity: 0; }
}

.registry-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}

@media (min-width: 1024px) {
    .registry-grid { grid-template-columns: repeat(3, 1fr); }
}

.registry-table {
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 24px;
}

.registry-table-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 0 16px 0;
    border-bottom: 1px solid var(--md-border);
    margin-bottom: 16px;
}

.registry-table-header-title {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: var(--md-muted);
}

.registry-table-title {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: var(--md-muted);
}

.registry-table-name {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 20px;
    color: var(--md-blue-deep);
    letter-spacing: -0.01em;
    margin-bottom: 16px;
}

.registry-table-count {
    text-align: right;
}

.registry-table-count-value {
    font-family: 'JetBrains Mono', monospace;
    font-weight: 700;
    font-size: 20px;
    color: var(--md-blue);
}

.registry-table-count-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--md-muted);
}

.registry-list {
    border-bottom: 1px solid var(--md-border);
}

.registry-list-item {
    border-bottom: 1px solid var(--md-border);
}

.registry-list-item:last-child {
    border-bottom: none;
}

.registry-list-item a {
    display: block;
    padding: 16px 0;
    transition: background-color 0.2s;
}

.registry-list-item a:hover {
    background-color: var(--md-bg);
}

.registry-row {
    padding: 20px 24px;
    border-bottom: 1px solid var(--md-border);
    transition: background-color 0.2s;
    display: block;
}

.registry-row:hover {
    background-color: var(--md-bg);
}

.registry-row:last-child {
    border-bottom: none;
}

.registry-row-top {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 16px;
}

.registry-row-name {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 15px;
    color: var(--md-blue-deep);
    line-height: 1.3;
}

.registry-row-kind {
    font-size: 12px;
    color: var(--md-muted);
    margin-top: 4px;
}

.status-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--md-green);
    background: rgba(22, 128, 60, 0.08);
    border: 1px solid rgba(22, 128, 60, 0.25);
    padding: 4px 8px;
    flex-shrink: 0;
}

.status-badge::before {
    content: '';
    width: 4px;
    height: 4px;
    background: var(--md-green);
    border-radius: 50%;
}

.registry-row-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 12px;
    font-size: 12px;
}

.registry-meta-item {
    display: flex;
    align-items: center;
    gap: 6px;
}

.registry-meta-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--md-muted);
}

.registry-meta-value {
    font-family: 'JetBrains Mono', monospace;
    font-weight: 500;
    color: var(--md-blue);
}

.registry-meta-value.address {
    color: var(--md-blue-deep);
    font-family: inherit;
    font-weight: 400;
}

.registry-show-all {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 24px;
    border-top: 1px solid var(--md-border);
    transition: background 0.2s, color 0.2s;
    cursor: pointer;
}

.registry-show-all:hover {
    background: var(--md-blue-deep);
    color: var(--md-white);
}

.registry-show-all-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    font-weight: 700;
}

/* ── Magazine Section ── */
.magazine-section {
    background: var(--md-bg);
    border-bottom: 1px solid var(--md-border);
}

.magazine-inner {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 80px 24px;
}

@media (min-width: 1024px) {
    .magazine-inner { padding: 80px 40px; }
}

.magazine-header {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-bottom: 48px;
}

@media (min-width: 768px) {
    .magazine-header {
        flex-direction: row;
        align-items: end;
        justify-content: space-between;
    }
}

.magazine-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: clamp(28px, 4vw, 48px);
    letter-spacing: -0.02em;
    line-height: 1;
    color: var(--md-blue-deep);
    max-width: 400px;
}

.magazine-title .accent {
    color: var(--md-blue);
}

.magazine-show-all {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border-bottom: 2px solid var(--md-blue-deep);
    padding-bottom: 4px;
    font-weight: 500;
    color: var(--md-blue-deep);
    transition: color 0.2s;
}

.magazine-show-all:hover {
    color: var(--md-blue);
    border-color: var(--md-blue);
}

.magazine-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}

@media (min-width: 1024px) {
    .magazine-grid { grid-template-columns: 7fr 5fr; }
}

.mag-card {
    display: block;
    background: var(--md-white);
    border: 1px solid var(--md-border);
    overflow: hidden;
    transition: box-shadow 0.3s;
}

.mag-card:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.mag-card-image {
    aspect-ratio: 16/10;
    overflow: hidden;
    background: var(--md-blue-deep);
}

.mag-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.mag-card:hover .mag-card-image img {
    transform: scale(1.04);
}

.mag-card-body {
    padding: 32px;
}

.mag-card-tag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    background: var(--md-blue-deep);
    color: var(--md-white);
    padding: 4px 10px;
    display: inline-block;
}

.mag-card-date {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--md-muted);
    margin-left: 12px;
}

.mag-card-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 28px;
    letter-spacing: -0.02em;
    line-height: 1.05;
    color: var(--md-blue-deep);
    margin-top: 20px;
    transition: color 0.2s;
}

.mag-card:hover .mag-card-title {
    color: var(--md-blue);
}

.mag-card-excerpt {
    margin-top: 20px;
    font-size: 15px;
    color: rgba(22, 31, 92, 0.7);
    line-height: 1.6;
    max-width: 500px;
}

.mag-card-cta {
    margin-top: 28px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--md-blue);
    font-weight: 700;
}

/* Side cards */
.mag-side-grid {
    display: grid;
    grid-template-rows: 1fr 1fr;
    gap: 24px;
}

.mag-side-card {
    display: flex;
    flex-direction: column;
    background: var(--md-white);
    border: 1px solid var(--md-border);
    overflow: hidden;
}

@media (min-width: 640px) {
    .mag-side-card {
        flex-direction: row;
    }
}

.mag-side-image {
    flex: 0 0 auto;
    width: 100%;
    aspect-ratio: 4/3;
}

@media (min-width: 640px) {
    .mag-side-image {
        width: 40%;
        aspect-ratio: auto;
    }
}

.mag-side-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mag-side-body {
    padding: 24px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex: 1;
}

.mag-side-tag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--md-blue);
    font-weight: 700;
}

.mag-side-date {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--md-muted);
    margin-left: 12px;
}

.mag-side-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 19px;
    line-height: 1.2;
    color: var(--md-blue-deep);
    margin-top: 12px;
    transition: color 0.2s;
}

.mag-side-card:hover .mag-side-title {
    color: var(--md-blue);
}

.mag-side-time {
    margin-top: 12px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--md-muted);
}

/* Bottom row */
.mag-bottom-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
    margin-top: 24px;
}

@media (min-width: 768px) {
    .mag-bottom-grid { grid-template-columns: repeat(3, 1fr); }
}

.mag-bottom-card {
    display: block;
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 28px;
    transition: border-color 0.2s;
}

.mag-bottom-card:hover {
    border-color: var(--md-blue-deep);
}

.mag-bottom-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.mag-bottom-cat {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: var(--md-muted);
}

.mag-bottom-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 20px;
    line-height: 1.2;
    letter-spacing: -0.01em;
    color: var(--md-blue-deep);
    transition: color 0.2s;
}

.mag-bottom-card:hover .mag-bottom-title {
    color: var(--md-blue);
}

.mag-bottom-excerpt {
    margin-top: 12px;
    font-size: 14px;
    color: rgba(22, 31, 92, 0.7);
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.mag-bottom-footer {
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px solid var(--md-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--md-muted);
}

/* ── Quick Links Section ── */
.quicklinks-section {
    background: var(--md-blue-deep);
    color: var(--md-white);
    border-bottom: 1px solid var(--md-border);
    position: relative;
    overflow: hidden;
}

.quicklinks-grid-dots {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(255,255,255,0.18) 1px, transparent 1px);
    background-size: 24px 24px;
    opacity: 0.3;
    pointer-events: none;
}

.quicklinks-inner {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 80px 24px;
    position: relative;
}

@media (min-width: 1024px) {
    .quicklinks-inner { padding: 80px 40px; }
}

.quicklinks-header {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
    margin-bottom: 56px;
    align-items: end;
}

@media (min-width: 1024px) {
    .quicklinks-header { grid-template-columns: 7fr 5fr; }
}

.quicklinks-kicker {
    font-family: 'JetBrains Mono', monospace;
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 0.22em;
    color: rgba(255,255,255,0.6);
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 24px;
}

.quicklinks-kicker .yellow {
    color: var(--md-yellow);
}

.quicklinks-kicker::before {
    content: '';
    width: 24px;
    height: 1px;
    background: rgba(255,255,255,0.6);
}

.quicklinks-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: clamp(28px, 4vw, 56px);
    letter-spacing: -0.03em;
    line-height: 0.95;
}

.quicklinks-title .yellow {
    color: var(--md-yellow);
}

.quicklinks-desc {
    font-size: 15px;
    color: rgba(255,255,255,0.7);
    line-height: 1.6;
    max-width: 400px;
}

.quicklinks-grid {
    display: grid;
    grid-template-columns: 1fr;
}

@media (min-width: 768px) {
    .quicklinks-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
    .quicklinks-grid { grid-template-columns: repeat(4, 1fr); }
}

.quicklink-item {
    display: block;
    padding: 28px;
    border-top: 2px solid rgba(255,255,255,0.2);
    transition: border-color 0.2s, background 0.2s;
}

.quicklink-item:hover {
    border-color: var(--md-yellow);
    background: rgba(255,255,255,0.04);
}

@media (min-width: 768px) {
    .quicklink-item:nth-child(n+2) { border-left: 1px solid rgba(255,255,255,0.15); }
}

.quicklink-kicker {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.22em;
    color: var(--md-yellow);
    margin-bottom: 48px;
}

.quicklink-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 22px;
    letter-spacing: -0.01em;
    line-height: 1.2;
    margin-bottom: 12px;
}

.quicklink-text {
    font-size: 13px;
    color: rgba(255,255,255,0.65);
    line-height: 1.6;
    margin-bottom: 40px;
}

.quicklink-arrow {
    color: var(--md-white);
    transition: color 0.2s, transform 0.2s;
}

.quicklink-item:hover .quicklink-arrow {
    color: var(--md-yellow);
    transform: translate(4px, -4px);
}

/* ── Reviews Section ── */
.reviews-section {
    background: var(--md-white);
    border-bottom: 1px solid var(--md-border);
}

.reviews-inner {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 80px 24px;
}

@media (min-width: 1024px) {
    .reviews-inner { padding: 80px 40px; }
}

.reviews-header {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-bottom: 48px;
}

@media (min-width: 768px) {
    .reviews-header {
        flex-direction: row;
        align-items: end;
        justify-content: space-between;
    }
}

.reviews-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: clamp(28px, 4vw, 48px);
    letter-spacing: -0.02em;
    line-height: 1;
    color: var(--md-blue-deep);
    max-width: 400px;
}

.reviews-show-all {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    font-weight: 700;
    color: var(--md-blue-deep);
    transition: color 0.2s;
}

.reviews-show-all:hover {
    color: var(--md-blue);
}

.reviews-grid {
    display: grid;
    grid-template-columns: 1fr;
    border-top: 1px solid var(--md-border);
    border-left: 1px solid var(--md-border);
}

@media (min-width: 768px) {
    .reviews-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
    .reviews-grid { grid-template-columns: repeat(3, 1fr); }
}

.review-card {
    border-right: 1px solid var(--md-border);
    border-bottom: 1px solid var(--md-border);
    padding: 28px;
    transition: background 0.2s;
}

.review-card:hover {
    background: var(--md-bg);
}

.review-quote {
    color: var(--md-yellow);
    margin-bottom: 16px;
}

.review-name {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 18px;
    color: var(--md-blue-deep);
    letter-spacing: -0.01em;
    line-height: 1.2;
}

.review-ico {
    margin-top: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--md-muted);
}

.review-address {
    margin-top: 12px;
    font-size: 13px;
    color: rgba(22, 31, 92, 0.7);
}

.review-footer {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid var(--md-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.review-stars {
    display: flex;
    align-items: center;
    gap: 2px;
}

.review-star {
    color: var(--md-yellow);
}

.review-star.empty {
    color: var(--md-border);
}

.review-rating {
    font-family: 'JetBrains Mono', monospace;
    font-weight: 700;
    color: var(--md-blue-deep);
    margin-left: 8px;
}

.review-count {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--md-muted);
}

/* ── Why Section ── */
.why-section {
    background: var(--md-bg);
    border-bottom: 1px solid var(--md-border);
}

.why-inner {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 80px 24px;
}

@media (min-width: 1024px) {
    .why-inner { padding: 80px 40px; }
}

.why-header {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
    margin-bottom: 56px;
}

@media (min-width: 1024px) {
    .why-header { grid-template-columns: 6fr 5fr; }
}

.why-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: clamp(28px, 4vw, 48px);
    letter-spacing: -0.02em;
    line-height: 1;
    color: var(--md-blue-deep);
}

.why-title .accent {
    color: var(--md-blue);
}

.why-desc {
    font-size: 16px;
    color: rgba(22, 31, 92, 0.75);
    line-height: 1.6;
    border-left: 2px solid var(--md-yellow);
    padding-left: 20px;
    align-self: end;
}

.why-grid {
    display: grid;
    grid-template-columns: 1fr;
    border-top: 2px solid var(--md-blue-deep);
}

@media (min-width: 768px) {
    .why-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
    .why-grid { grid-template-columns: repeat(3, 1fr); }
}

.why-card {
    background: var(--md-white);
    padding: 32px;
    border-bottom: 1px solid var(--md-border);
    border-right: 1px solid var(--md-border);
    position: relative;
}

@media (min-width: 1024px) {
    .why-card:nth-child(3n) { border-right: none; }
}

.why-num {
    font-family: 'JetBrains Mono', monospace;
    font-weight: 700;
    font-size: 28px;
    color: var(--md-blue);
    margin-bottom: 32px;
}

.why-asterisk {
    position: absolute;
    top: 32px;
    right: 32px;
    color: var(--md-yellow);
}

.why-card-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 20px;
    letter-spacing: -0.01em;
    line-height: 1.2;
    color: var(--md-blue-deep);
}

.why-card-text {
    margin-top: 12px;
    font-size: 14px;
    color: rgba(22, 31, 92, 0.7);
    line-height: 1.6;
}

/* ── Final CTA ── */
.final-cta-section {
    background: var(--md-yellow);
    border-bottom: 1px solid var(--md-border);
    position: relative;
    overflow: hidden;
}

.final-cta-deco1 {
    position: absolute;
    right: -48px;
    top: -48px;
    width: 240px;
    height: 240px;
    border: 8px solid var(--md-blue-deep);
    transform: rotate(12deg);
    opacity: 0.4;
    pointer-events: none;
}

.final-cta-deco2 {
    position: absolute;
    left: -32px;
    bottom: -48px;
    width: 160px;
    height: 160px;
    background: var(--md-blue-deep);
    transform: rotate(12deg);
    opacity: 0.1;
    pointer-events: none;
}

.final-cta-inner {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 96px 24px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 48px;
    align-items: end;
    position: relative;
}

@media (min-width: 1024px) {
    .final-cta-inner { grid-template-columns: 8fr 4fr; }
}

.final-cta-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: clamp(32px, 6vw, 72px);
    letter-spacing: -0.03em;
    line-height: 0.9;
    color: var(--md-blue-deep);
}

.final-cta-title .underline {
    text-decoration: underline;
    text-decoration-style: solid;
    text-decoration-thickness: 6px;
    text-underline-offset: 8px;
    text-decoration-color: var(--md-blue);
}

.final-cta-buttons {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.final-cta-btn {
    display: block;
    text-align: center;
    font-weight: 700;
    font-size: 17px;
    padding: 20px;
    transition: background 0.2s, color 0.2s;
    font-family: inherit;
}

.final-cta-btn-primary {
    background: var(--md-blue-deep);
    color: var(--md-white);
}

.final-cta-btn-primary:hover {
    background: var(--md-blue);
}

.final-cta-btn-secondary {
    border: 2px solid var(--md-blue-deep);
    color: var(--md-blue-deep);
    background: transparent;
}

.final-cta-btn-secondary:hover {
    background: var(--md-blue-deep);
    color: var(--md-yellow);
}

.final-cta-note {
    margin-top: 12px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: rgba(22, 31, 92, 0.7);
    display: flex;
    align-items: center;
    gap: 8px;
}

/* ── Footer ── */
.footer {
    background: var(--md-blue-deep);
    color: var(--md-white);
    position: relative;
    overflow: hidden;
    margin-top: auto;
}

.footer-grid-dots {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(255,255,255,0.18) 1px, transparent 1px);
    background-size: 24px 24px;
    opacity: 0.3;
    pointer-events: none;
}

.footer-inner {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 80px 24px 40px;
    position: relative;
}

@media (min-width: 1024px) {
    .footer-inner { padding: 80px 40px 40px; }
}

/* Newsletter */
.footer-newsletter {
    display: grid;
    grid-template-columns: 1fr;
    gap: 48px;
    padding-bottom: 64px;
    border-bottom: 1px solid rgba(255,255,255,0.15);
}

@media (min-width: 1024px) {
    .footer-newsletter { grid-template-columns: 7fr 5fr; }
}

.footer-newsletter-kicker {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: var(--md-yellow);
    margin-bottom: 24px;
}

.footer-newsletter-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: clamp(28px, 4vw, 48px);
    letter-spacing: -0.03em;
    line-height: 0.95;
}

.footer-newsletter-title .yellow {
    color: var(--md-yellow);
}

.footer-newsletter-desc {
    margin-top: 24px;
    max-width: 400px;
    font-size: 15px;
    color: rgba(255,255,255,0.7);
    line-height: 1.6;
}

.footer-newsletter-form {
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid rgba(255,255,255,0.2);
}

@media (min-width: 640px) {
    .footer-newsletter-form {
        flex-direction: row;
    }
}

.footer-newsletter-icon {
    display: flex;
    align-items: center;
    padding: 0 16px;
    color: rgba(255,255,255,0.4);
}

.footer-newsletter-input {
    flex: 1;
    background: transparent;
    padding: 20px 16px;
    color: var(--md-white);
    font-size: 15px;
    font-family: inherit;
    font-weight: 500;
    border: none;
    outline: none;
}

.footer-newsletter-input::placeholder {
    color: rgba(255,255,255,0.35);
}

.footer-newsletter-submit {
    background: var(--md-yellow);
    color: var(--md-blue-deep);
    font-weight: 700;
    padding: 20px 28px;
    border: none;
    cursor: pointer;
    font-size: 15px;
    font-family: inherit;
    transition: background 0.2s;
}

.footer-newsletter-submit:hover {
    background: var(--md-yellow-hover);
}

.footer-newsletter-gdpr {
    margin-top: 12px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: rgba(255,255,255,0.4);
}

/* Footer columns */
.footer-cols {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
    padding: 64px 0;
}

@media (min-width: 768px) {
    .footer-cols { grid-template-columns: 2fr 1fr 1fr 1fr; }
}

.footer-col-logo {
    display: flex;
    align-items: center;
    gap: 12px;
}

.footer-col-logo-icon {
    width: 48px;
    height: 48px;
    background: var(--md-yellow);
    display: flex;
    align-items: center;
    justify-content: center;
}

.footer-col-logo-icon span {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 17px;
    color: var(--md-blue-deep);
}

.footer-col-logo-text {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 16px;
    letter-spacing: -0.01em;
}

.footer-col-logo-sub {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: rgba(255,255,255,0.45);
}

.footer-col-about {
    margin-top: 24px;
    max-width: 320px;
    font-size: 14px;
    color: rgba(255,255,255,0.6);
    line-height: 1.6;
}

.footer-col-title {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: rgba(255,255,255,0.8);
    margin-bottom: 20px;
}

.footer-col-links {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.footer-col-links a {
    font-size: 14px;
    color: rgba(255,255,255,0.85);
    transition: color 0.2s;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.footer-col-links a:hover {
    color: var(--md-yellow);
}

/* Footer wordmark */
.footer-wordmark {
    padding-bottom: 40px;
    margin-bottom: -8px;
    user-select: none;
    overflow: hidden;
}

.footer-wordmark-text {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: clamp(60px, 18vw, 200px);
    line-height: 0.8;
    letter-spacing: -0.03em;
    color: rgba(255,255,255,0.06);
    white-space: nowrap;
}

/* Footer bottom */
.footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.15);
    padding-top: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    font-size: 12px;
    color: rgba(255,255,255,0.5);
}

@media (min-width: 768px) {
    .footer-bottom {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
}

.footer-bottom-links {
    display: flex;
    gap: 24px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.16em;
}

.footer-bottom-links a {
    color: rgba(255,255,255,0.5);
    transition: color 0.2s;
}

.footer-bottom-links a:hover {
    color: var(--md-yellow);
}

/* ── Page Header (sub-pages) ── */
.page-header {
    padding: 48px 0 32px;
}

.page-header h1 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: clamp(28px, 4vw, 48px);
    letter-spacing: -0.02em;
    color: var(--md-blue-deep);
}

.page-header p {
    margin-top: 12px;
    font-size: 16px;
    color: var(--md-muted);
}

/* ── Cards ── */
.card {
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 24px;
}

/* ── Section Title ── */
.section-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 24px;
    color: var(--md-blue-deep);
    margin-bottom: 24px;
}

/* ── Data Boxes Grid ── */
.data-boxes-section {
    padding: 48px 0;
}

.data-boxes-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 24px;
}

.databox-card {
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 24px;
    transition: box-shadow 0.2s;
}

.databox-card:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.databox-header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

.company-name {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: var(--md-blue-deep);
    line-height: 1.3;
}

.databox-info {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.info-row {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
}

.info-row .label {
    font-size: 16px;
}

.info-row .mono {
    font-family: 'JetBrains Mono', monospace;
    font-weight: 500;
    color: var(--md-blue);
}

.category-badge {
    display: inline-block;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--md-blue-deep);
    background: var(--md-bg);
    padding: 4px 10px;
    margin-top: 12px;
}

.detail-btn {
    display: inline-block;
    background: var(--md-blue-deep);
    color: var(--md-white);
    padding: 10px 20px;
    font-weight: 700;
    font-size: 13px;
    border: none;
    cursor: pointer;
    margin-top: 16px;
    transition: background 0.2s;
    font-family: inherit;
}

.detail-btn:hover {
    background: var(--md-blue);
}

/* ── Article Cards ── */
.home-articles-section {
    padding: 48px 0;
}

.home-articles-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 24px;
}

.home-article-card {
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 24px;
    transition: box-shadow 0.2s;
}

.home-article-card:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.home-article-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.home-article-category {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--md-blue);
    font-weight: 700;
}

.home-article-date {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--md-muted);
}

.home-article-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 18px;
    line-height: 1.3;
    color: var(--md-blue-deep);
    margin-bottom: 12px;
}

.home-article-title a:hover {
    color: var(--md-blue);
}

.home-article-excerpt {
    font-size: 14px;
    color: rgba(22, 31, 92, 0.7);
    line-height: 1.6;
}

.home-articles-more {
    text-align: center;
    margin-top: 32px;
}

.home-articles-more-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    font-weight: 700;
    color: var(--md-blue-deep);
    border-bottom: 2px solid var(--md-blue-deep);
    padding-bottom: 4px;
    transition: color 0.2s, border-color 0.2s;
}

.home-articles-more-btn:hover {
    color: var(--md-blue);
    border-color: var(--md-blue);
}

/* ── Search Page ── */
.search-section {
    padding: 48px 0 24px;
}

.search-container {
    max-width: 720px;
    margin: 0 auto;
}

.search-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: clamp(24px, 3vw, 36px);
    letter-spacing: -0.02em;
    color: var(--md-blue-deep);
    margin-bottom: 24px;
}

.search-form {
    display: flex;
    gap: 12px;
}

.search-form input {
    flex: 1;
    padding: 14px 18px;
    border: 1px solid var(--md-border);
    font-size: 15px;
    font-family: inherit;
    outline: none;
    transition: border-color 0.2s;
}

.search-form input:focus {
    border-color: var(--md-blue-deep);
}

.search-form button {
    background: var(--md-blue-deep);
    color: var(--md-white);
    padding: 14px 24px;
    font-weight: 700;
    font-size: 14px;
    border: none;
    cursor: pointer;
    font-family: inherit;
    transition: background 0.2s;
}

.search-form button:hover {
    background: var(--md-blue);
}

.search-results-info {
    margin-top: 16px;
    font-size: 14px;
    color: var(--md-muted);
}

/* ── Detail Page ── */
.detail-page {
    padding: 48px 0;
}

.detail-container {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
}

@media (min-width: 1024px) {
    .detail-container { grid-template-columns: 2fr 1fr; }
}

.detail-header {
    margin-bottom: 32px;
}

.detail-header h1 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 32px;
    color: var(--md-blue-deep);
}

.company-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 12px;
    font-size: 14px;
    color: var(--md-muted);
}

.company-meta code {
    font-family: 'JetBrains Mono', monospace;
    background: var(--md-bg);
    padding: 2px 8px;
    font-size: 13px;
}

.detail-main {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.detail-sidebar {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.info-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

@media (min-width: 640px) {
    .info-grid { grid-template-columns: 1fr 1fr; }
}

.info-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.info-item .label {
    font-size: 12px;
    color: var(--md-muted);
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.info-item span:not(.label):not(.category-badge):not(.status-badge):not(code) {
    font-size: 15px;
    color: var(--md-blue-deep);
}

/* ── Magazine Page ── */
.magazine-page {
    padding: 48px 0;
}

.featured-section {
    margin-bottom: 48px;
}

.featured-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 24px;
}

.featured-article {
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 24px;
}

.featured-badge {
    display: inline-block;
    background: var(--md-yellow);
    color: var(--md-blue-deep);
    font-size: 11px;
    font-weight: 700;
    padding: 4px 12px;
    margin-bottom: 16px;
}

.featured-article h3 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 20px;
    color: var(--md-blue-deep);
    margin-bottom: 8px;
}

.featured-article p {
    font-size: 14px;
    color: var(--md-muted);
    line-height: 1.6;
}

.featured-article-footer {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--md-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.article-meta {
    font-size: 12px;
    color: var(--md-muted);
}

.read-btn {
    background: var(--md-blue);
    color: var(--md-white);
    padding: 8px 16px;
    font-weight: 700;
    font-size: 13px;
    border: none;
    cursor: pointer;
    font-family: inherit;
    transition: background 0.2s;
}

.read-btn:hover {
    background: var(--md-blue-hover);
}

.articles-section {
    margin-bottom: 48px;
}

.articles-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 24px;
}

.article-card {
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 24px;
    transition: box-shadow 0.2s;
}

.article-card:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.article-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.read-time {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--md-muted);
}

.article-card h3 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 18px;
    color: var(--md-blue-deep);
    margin-bottom: 8px;
}

.article-card p {
    font-size: 14px;
    color: var(--md-muted);
    line-height: 1.6;
}

.article-meta {
    margin-top: 12px;
    font-size: 12px;
    color: var(--md-muted);
    display: flex;
    gap: 16px;
}

.read-more-btn {
    margin-top: 16px;
    background: none;
    border: none;
    color: var(--md-blue);
    font-weight: 700;
    font-size: 14px;
    cursor: pointer;
    font-family: inherit;
    padding: 0;
}

.read-more-btn:hover {
    color: var(--md-blue-hover);
}

/* Newsletter */
.newsletter-section {
    padding: 48px 0;
}

.newsletter-content {
    text-align: center;
}

.newsletter-content h3 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 28px;
    color: var(--md-blue-deep);
    margin-bottom: 12px;
}

.newsletter-content p {
    font-size: 15px;
    color: var(--md-muted);
    margin-bottom: 24px;
}

.newsletter-form {
    display: flex;
    gap: 12px;
    max-width: 480px;
    margin: 0 auto;
}

.newsletter-form input {
    flex: 1;
    padding: 14px 18px;
    border: 1px solid var(--md-border);
    font-size: 15px;
    font-family: inherit;
    outline: none;
}

.newsletter-form button {
    background: var(--md-blue-deep);
    color: var(--md-white);
    padding: 14px 24px;
    font-weight: 700;
    border: none;
    cursor: pointer;
    font-family: inherit;
}

/* ── Article Detail ── */
.article-detail {
    max-width: 800px;
    margin: 0 auto;
    padding: 48px 0;
}

.article-detail-header h1 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: clamp(28px, 4vw, 44px);
    letter-spacing: -0.02em;
    color: var(--md-blue-deep);
    margin-bottom: 16px;
}

.article-detail-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    font-size: 14px;
    color: var(--md-muted);
}

.article-detail-content {
    margin-top: 32px;
    font-size: 17px;
    line-height: 1.8;
    color: var(--md-blue-deep);
}

.article-detail-content p,
.article-detail-content ul,
.article-detail-content ol,
.article-detail-content h2,
.article-detail-content h3 {
    margin-bottom: 16px;
}

/* ── Related Articles ── */
.related-articles-section {
    padding: 48px 0;
}

.related-articles-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 24px;
}

.related-article-card {
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 24px;
}

.related-article-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.related-article-category {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--md-blue);
    font-weight: 700;
}

.related-article-date {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--md-muted);
}

.related-article-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 17px;
    color: var(--md-blue-deep);
    margin-bottom: 8px;
    line-height: 1.3;
}

.related-article-title a:hover {
    color: var(--md-blue);
}

.related-article-excerpt {
    font-size: 13px;
    color: var(--md-muted);
    line-height: 1.5;
}

.related-article-footer {
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid var(--md-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.related-article-author {
    font-size: 12px;
    color: var(--md-muted);
}

.related-article-btn {
    color: var(--md-blue);
    font-weight: 700;
    font-size: 13px;
}

/* ── FAQ ── */
.faq-enhanced {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 24px;
}

.faq-card {
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 24px;
}

.faq-question {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.faq-icon {
    font-size: 20px;
}

.faq-question h4 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: var(--md-blue-deep);
}

.faq-answer p {
    font-size: 14px;
    color: var(--md-muted);
    line-height: 1.6;
}

/* ── Pagination ── */
.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-top: 32px;
    flex-wrap: wrap;
}

.pagination a,
.pagination span {
    padding: 8px 14px;
    font-size: 14px;
    border-radius: 4px;
    text-decoration: none;
}

.pagination a {
    background: var(--md-bg);
    color: var(--md-blue-deep);
    border: 1px solid var(--md-border);
}

.pagination a:hover {
    background: var(--md-blue-deep);
    color: var(--md-white);
    border-color: var(--md-blue-deep);
}

.pagination span.current {
    background: var(--md-blue-deep);
    color: var(--md-white);
    font-weight: 700;
}

.pagination-info {
    text-align: center;
    margin-top: 16px;
    font-size: 13px;
    color: var(--md-muted);
}

/* ── Back Button ── */
.back-section {
    text-align: center;
    padding: 32px 0;
}

.back-btn {
    display: inline-block;
    color: var(--md-blue);
    font-weight: 700;
    font-size: 15px;
    border-bottom: 2px solid var(--md-blue);
    padding-bottom: 2px;
    transition: color 0.2s, border-color 0.2s;
}

.back-btn:hover {
    color: var(--md-blue-hover);
    border-color: var(--md-blue-hover);
}

/* ── 404 ── */
.error-page {
    text-align: center;
    padding: 120px 24px;
}

.error-page h1 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: clamp(64px, 15vw, 180px);
    letter-spacing: -0.04em;
    line-height: 0.9;
    color: var(--md-blue-deep);
}

.error-page p {
    margin-top: 24px;
    font-size: 18px;
    color: var(--md-muted);
}

.error-page a {
    display: inline-block;
    margin-top: 32px;
    background: var(--md-blue-deep);
    color: var(--md-white);
    padding: 14px 32px;
    font-weight: 700;
    transition: background 0.2s;
}

.error-page a:hover {
    background: var(--md-blue);
}

/* ── Contact Page ── */
.contact-page {
    padding: 48px 0;
}

.contact-content {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
}

@media (min-width: 1024px) {
    .contact-content { grid-template-columns: 2fr 1fr; }
}

.contact-form-section .form-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

@media (min-width: 640px) {
    .contact-form-section .form-row { grid-template-columns: 1fr 1fr; }
}

.form-group {
    margin-bottom: 16px;
}

.form-group label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--md-blue-deep);
    margin-bottom: 6px;
}

.form-group input,
.form-group textarea {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid var(--md-border);
    font-size: 15px;
    font-family: inherit;
    outline: none;
    transition: border-color 0.2s;
}

.form-group input:focus,
.form-group textarea:focus {
    border-color: var(--md-blue-deep);
}

.form-group textarea {
    min-height: 140px;
    resize: vertical;
}

.submit-btn {
    background: var(--md-blue-deep);
    color: var(--md-white);
    padding: 14px 32px;
    font-weight: 700;
    font-size: 15px;
    border: none;
    cursor: pointer;
    font-family: inherit;
    transition: background 0.2s;
}

.submit-btn:hover {
    background: var(--md-blue);
}

.contact-info-section {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.contact-info {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.info-item {
    display: flex;
    gap: 16px;
}

.info-icon {
    font-size: 24px;
    flex-shrink: 0;
}

.info-item h3 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: var(--md-blue-deep);
    margin-bottom: 4px;
}

.info-item p {
    font-size: 14px;
    color: var(--md-muted);
    line-height: 1.5;
}

/* ── Setup / Info Pages ── */
.setup-content {
    padding: 48px 0;
    max-width: 900px;
    margin: 0 auto;
}

.setup-content .card {
    margin-bottom: 24px;
}

.setup-content h2 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 24px;
    color: var(--md-blue-deep);
    margin-bottom: 20px;
}

.info-grid-highlight {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 20px;
}

.info-highlight {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px;
    background: var(--md-bg);
    border: 1px solid var(--md-border);
}

.highlight-icon {
    font-size: 28px;
    flex-shrink: 0;
}

.info-highlight h3 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 15px;
    color: var(--md-blue-deep);
    margin-bottom: 4px;
}

.info-highlight p {
    font-size: 13px;
    color: var(--md-muted);
}

.step-guide {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.step {
    display: flex;
    gap: 20px;
}

.step-number {
    width: 40px;
    height: 40px;
    background: var(--md-blue);
    color: var(--md-white);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 18px;
    flex-shrink: 0;
}

.step-content h3 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 17px;
    color: var(--md-blue-deep);
    margin-bottom: 8px;
}

.step-content p {
    font-size: 14px;
    color: var(--md-muted);
    margin-bottom: 8px;
}

.step-content ul {
    list-style: disc;
    padding-left: 20px;
    font-size: 14px;
    color: var(--md-muted);
}

.step-content li {
    margin-bottom: 4px;
}

/* ── Login Page ── */
.login-content {
    padding: 48px 0;
    max-width: 900px;
    margin: 0 auto;
}

.login-quick-access {
    margin-bottom: 32px;
}

.login-buttons {
    display: flex;
    gap: 16px;
    margin-top: 16px;
}

.login-btn {
    display: inline-block;
    padding: 14px 28px;
    font-weight: 700;
    font-size: 15px;
    border: 1px solid var(--md-border);
    transition: all 0.2s;
}

.login-btn.primary {
    background: var(--md-blue-deep);
    color: var(--md-white);
}

.login-btn.primary:hover {
    background: var(--md-blue);
}

.login-btn.secondary {
    background: var(--md-bg);
    color: var(--md-blue-deep);
}

.login-btn.secondary:hover {
    background: var(--md-border);
}

.login-methods {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 20px;
    margin-bottom: 32px;
}

.method-card {
    padding: 24px;
    background: var(--md-white);
    border: 1px solid var(--md-border);
}

.method-icon {
    font-size: 32px;
    margin-bottom: 12px;
}

.method-card h3 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 17px;
    color: var(--md-blue-deep);
    margin-bottom: 8px;
}

.method-card p {
    font-size: 13px;
    color: var(--md-muted);
    margin-bottom: 12px;
}

.method-card ul {
    list-style: disc;
    padding-left: 18px;
    font-size: 13px;
    color: var(--md-muted);
}

.method-card li {
    margin-bottom: 4px;
}

.security-tips {
    margin-bottom: 32px;
}

.tips-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
}

.tip-item {
    display: flex;
    gap: 16px;
    padding: 20px;
    background: var(--md-bg);
    border: 1px solid var(--md-border);
}

.tip-icon {
    font-size: 24px;
    flex-shrink: 0;
}

.tip-content h3 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 15px;
    color: var(--md-blue-deep);
    margin-bottom: 4px;
}

.tip-content p {
    font-size: 13px;
    color: var(--md-muted);
    line-height: 1.5;
}

.faq-section {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.faq-section h3 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: var(--md-blue-deep);
    margin-bottom: 8px;
}

.faq-section ul {
    list-style: disc;
    padding-left: 20px;
    font-size: 14px;
    color: var(--md-muted);
}

.faq-section li {
    margin-bottom: 4px;
}

.alert {
    padding: 12px 16px;
    margin-top: 12px;
    border-radius: 4px;
    font-size: 13px;
}

.alert.warning {
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #f59e0b;
}

.help-section {
    margin-top: 32px;
}

.help-contacts {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 20px;
}

.contact-card {
    padding: 20px;
    background: var(--md-bg);
    border: 1px solid var(--md-border);
}

.contact-card h3 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: var(--md-blue-deep);
    margin-bottom: 8px;
}

.contact-card p {
    font-size: 14px;
    color: var(--md-muted);
    line-height: 1.5;
}

.contact-card a {
    color: var(--md-blue);
}

/* ── Notari / Posty listing ── */
.notari-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 24px;
}

.notar-card {
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 24px;
    transition: box-shadow 0.2s;
}

.notar-card:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.notar-header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

.notar-name a {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 17px;
    color: var(--md-blue-deep);
    transition: color 0.2s;
}

.notar-name a:hover {
    color: var(--md-blue);
}

.notar-ico {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--md-muted);
}

.notar-content {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.notar-detail {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: var(--md-muted);
}

.notar-detail .detail-icon {
    font-size: 16px;
    flex-shrink: 0;
}

.notar-detail a {
    color: var(--md-blue);
}

.notar-footer {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid var(--md-border);
}

/* ── PSC ── */
.psc-search {
    max-width: 720px;
    margin: 0 auto 32px;
}

.psc-search-form {
    display: flex;
    gap: 12px;
}

.psc-search-form input {
    flex: 1;
    padding: 14px 18px;
    border: 1px solid var(--md-border);
    font-size: 15px;
    font-family: inherit;
    outline: none;
}

.psc-search-form input:focus {
    border-color: var(--md-blue-deep);
}

.psc-search-form button {
    background: var(--md-blue-deep);
    color: var(--md-white);
    padding: 14px 24px;
    font-weight: 700;
    border: none;
    cursor: pointer;
    font-family: inherit;
}

.psc-table {
    width: 100%;
    background: var(--md-white);
    border: 1px solid var(--md-border);
    border-collapse: collapse;
}

.psc-table th {
    background: var(--md-bg);
    padding: 12px 16px;
    text-align: left;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: var(--md-muted);
    border-bottom: 1px solid var(--md-border);
}

.psc-table td {
    padding: 12px 16px;
    font-size: 14px;
    border-bottom: 1px solid var(--md-border);
    color: var(--md-blue-deep);
}

.psc-table tr:hover td {
    background: var(--md-bg);
}

/* ── Banner / Ad ── */
.banner-section {
    padding: 32px 0;
}

.banner-inner {
    text-align: center;
}

.banner-iframe {
    width: 100%;
    max-width: 728px;
    height: 90px;
    border: 1px solid var(--md-border);
    background: var(--md-bg);
}

/* ── Utility ── */
.text-center { text-align: center; }
.mt-4 { margin-top: 16px; }
.mb-4 { margin-bottom: 16px; }

/* ── Responsive ── */
@media (max-width: 639px) {
    .hero-search-form {
        flex-direction: column;
    }
    .hero-search-btn {
        justify-content: center;
        padding: 16px;
    }
    .hero-search-input {
        height: auto;
        padding: 16px;
    }
}
/* ── Search Page ── */
.search-section {
    padding: 40px 24px;
    background: var(--md-bg);
}

.search-container {
    max-width: var(--container-max);
    margin: 0 auto;
}

.search-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 28px;
    color: var(--md-blue-deep);
    margin-bottom: 20px;
}

.search-form {
    display: flex;
    gap: 12px;
    margin-bottom: 20px;
}

.search-form input {
    flex: 1;
    padding: 12px 16px;
    border: 2px solid var(--md-border);
    border-radius: 4px;
    font-size: 15px;
    font-family: 'Inter', sans-serif;
}

.search-form button {
    padding: 12px 24px;
    background: var(--md-blue);
    color: var(--md-white);
    border: none;
    border-radius: 4px;
    font-weight: 700;
    cursor: pointer;
    font-family: 'Inter', sans-serif;
}

.search-results-info {
    font-size: 14px;
    color: var(--md-muted);
    margin-bottom: 24px;
}

.data-boxes-section {
    padding: 40px 24px;
}

.data-boxes-grid {
    max-width: var(--container-max);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

@media (min-width: 768px) {
    .data-boxes-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    .data-boxes-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* ── Detail Page ── */
.detail-page {
    padding: 40px 24px;
}

.detail-container {
    max-width: var(--container-max);
    margin: 0 auto;
}

.detail-main {
    max-width: 800px;
}

.detail-header {
    margin-bottom: 32px;
}

.detail-header h1 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 32px;
    color: var(--md-blue-deep);
    margin-bottom: 16px;
}

.company-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: center;
    font-size: 14px;
    color: var(--md-muted);
}

.company-meta code {
    background: var(--md-bg);
    padding: 2px 8px;
    border-radius: 3px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
}

.status-badge {
    background: #dcfce7;
    color: #166534;
    padding: 4px 12px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
}

.card {
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 24px;
    margin-bottom: 20px;
}

.info-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

@media (min-width: 768px) {
    .info-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

.info-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.info-item .label {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--md-muted);
}

.category-badge {
    background: var(--md-blue-deep);
    color: var(--md-white);
    padding: 4px 12px;
    border-radius: 4px;
    font-size: 13px;
    display: inline-block;
}

.similar-section {
    margin-top: 40px;
}

.similar-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    margin-top: 20px;
}

@media (min-width: 768px) {
    .similar-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    .similar-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

.similar-card {
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 20px;
    text-decoration: none;
    transition: transform 0.2s, box-shadow 0.2s;
}

.similar-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.similar-card h3 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: var(--md-blue-deep);
    margin-bottom: 8px;
}

.similar-card p {
    font-size: 13px;
    color: var(--md-muted);
}

/* ── Magazin Page ── */
.magazin-page {
    padding: 40px 24px;
}

.magazin-container {
    max-width: var(--container-max);
    margin: 0 auto;
}

.magazin-header {
    margin-bottom: 32px;
}

.magazin-header h1 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 32px;
    color: var(--md-blue-deep);
    margin-bottom: 16px;
}

.magazin-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}

@media (min-width: 768px) {
    .magazin-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

.magazin-card {
    background: var(--md-white);
    border: 1px solid var(--md-border);
    overflow: hidden;
    text-decoration: none;
    transition: transform 0.2s, box-shadow 0.2s;
}

.magazin-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.magazin-card-image {
    width: 100%;
    height: 200px;
    object-fit: cover;
}

.magazin-card-body {
    padding: 20px;
}

.magazin-card-tag {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--md-blue);
    font-weight: 700;
}

.magazin-card-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 18px;
    color: var(--md-blue-deep);
    margin: 8px 0;
}

.magazin-card-excerpt {
    font-size: 14px;
    color: var(--md-muted);
    line-height: 1.5;
}

/* ── Clanek Page ── */
.clanek-page {
    padding: 40px 24px;
}

.clanek-container {
    max-width: 800px;
    margin: 0 auto;
}

.clanek-header {
    margin-bottom: 32px;
}

.clanek-header h1 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 36px;
    color: var(--md-blue-deep);
    margin-bottom: 16px;
    line-height: 1.2;
}

.clanek-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    font-size: 14px;
    color: var(--md-muted);
    margin-bottom: 24px;
}

.clanek-content {
    font-size: 16px;
    line-height: 1.7;
    color: var(--md-blue-deep);
}

.clanek-content h2 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 24px;
    color: var(--md-blue-deep);
    margin: 32px 0 16px;
}

.clanek-content h3 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 20px;
    color: var(--md-blue-deep);
    margin: 24px 0 12px;
}

.clanek-content p {
    margin-bottom: 16px;
}

.clanek-content ul, .clanek-content ol {
    margin-bottom: 16px;
    padding-left: 24px;
}

.clanek-content li {
    margin-bottom: 8px;
}

.clanek-content blockquote {
    border-left: 4px solid var(--md-blue);
    padding: 16px 20px;
    margin: 24px 0;
    background: var(--md-bg);
    font-style: italic;
}

.clanek-content img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin: 24px 0;
}

.clanek-tags {
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid var(--md-border);
}

.clanek-tags span {
    display: inline-block;
    background: var(--md-bg);
    padding: 4px 12px;
    border-radius: 4px;
    font-size: 13px;
    color: var(--md-muted);
    margin-right: 8px;
    margin-bottom: 8px;
}

/* ── Notari/Posta/PSC/Firma/Contact/Login Pages ── */
.notari-page, .posta-page, .psc-page, .firma-page, .contact-page, .login-page {
    padding: 40px 24px;
}

.notari-container, .posta-container, .psc-container, .firma-container, .contact-container, .login-container {
    max-width: var(--container-max);
    margin: 0 auto;
}

.notari-header, .posta-header, .psc-header, .firma-header, .contact-header, .login-header {
    margin-bottom: 32px;
}

.notari-header h1, .posta-header h1, .psc-header h1, .firma-header h1, .contact-header h1, .login-header h1 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 32px;
    color: var(--md-blue-deep);
    margin-bottom: 16px;
}

.notari-list, .post-list, .psc-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

@media (min-width: 768px) {
    .notari-list, .post-list, .psc-list {
        grid-template-columns: repeat(2, 1fr);
    }
}

.notary-item, .post-item, .psc-item {
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 20px;
    text-decoration: none;
    transition: transform 0.2s, box-shadow 0.2s;
}

.notary-item:hover, .post-item:hover, .psc-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.notary-name, .post-name, .psc-code {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 18px;
    color: var(--md-blue-deep);
    margin-bottom: 8px;
}

.notary-office, .post-address, .psc-place {
    font-size: 14px;
    color: var(--md-muted);
    margin-bottom: 4px;
}

.notary-address, .post-phone, .psc-place {
    font-size: 13px;
    color: var(--md-muted);
}

.notary-phone, .notary-email {
    font-size: 13px;
    color: var(--md-blue);
    margin-top: 8px;
}

/* ── Firma Detail ── */
.firm-detail {
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 24px;
    margin-bottom: 24px;
}

.firm-detail h2 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 24px;
    color: var(--md-blue-deep);
    margin-bottom: 16px;
}

.firm-info-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

@media (min-width: 768px) {
    .firm-info-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

.firm-info-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.firm-info-label {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--md-muted);
}

/* ── Contact Form ── */
.contact-form {
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 24px;
    margin-bottom: 24px;
}

.contact-form h2 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 24px;
    color: var(--md-blue-deep);
    margin-bottom: 20px;
}

.contact-form form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.contact-form input, .contact-form textarea {
    padding: 12px 16px;
    border: 2px solid var(--md-border);
    border-radius: 4px;
    font-size: 15px;
    font-family: 'Inter', sans-serif;
}

.contact-form textarea {
    min-height: 120px;
    resize: vertical;
}

.contact-form button {
    padding: 12px 24px;
    background: var(--md-blue);
    color: var(--md-white);
    border: none;
    border-radius: 4px;
    font-weight: 700;
    cursor: pointer;
    font-family: 'Inter', sans-serif;
    align-self: flex-start;
}

.contact-info {
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 24px;
}

.contact-info h2 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 24px;
    color: var(--md-blue-deep);
    margin-bottom: 16px;
}

.contact-info p {
    font-size: 15px;
    color: var(--md-muted);
    line-height: 1.6;
    margin-bottom: 12px;
}

/* ── Login Form ── */
.login-form {
    max-width: 400px;
    margin: 0 auto;
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 32px;
}

.login-form h2 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 24px;
    color: var(--md-blue-deep);
    margin-bottom: 24px;
    text-align: center;
}

.login-form form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.login-form input {
    padding: 12px 16px;
    border: 2px solid var(--md-border);
    border-radius: 4px;
    font-size: 15px;
    font-family: 'Inter', sans-serif;
}

.login-form button {
    padding: 12px 24px;
    background: var(--md-blue);
    color: var(--md-white);
    border: none;
    border-radius: 4px;
    font-weight: 700;
    cursor: pointer;
    font-family: 'Inter', sans-serif;
}

/* ── Hodnoceni Page ── */
.hodnoceni-page {
    padding: 40px 24px;
}

.hodnoceni-container {
    max-width: var(--container-max);
    margin: 0 auto;
}

.hodnoceni-header {
    margin-bottom: 32px;
}

.hodnoceni-header h1 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 32px;
    color: var(--md-blue-deep);
    margin-bottom: 16px;
}

.rating-summary {
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 24px;
    margin-bottom: 24px;
    text-align: center;
}

.rating-big-number {
    font-family: 'JetBrains Mono', monospace;
    font-size: 48px;
    font-weight: 700;
    color: var(--md-blue-deep);
}

.rating-breakdown {
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 24px;
    margin-bottom: 24px;
}

.rating-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
}

.rating-bar-label {
    font-size: 14px;
    color: var(--md-muted);
    min-width: 20px;
}

.rating-bar-track {
    flex: 1;
    height: 8px;
    background: var(--md-bg);
    border-radius: 4px;
    overflow: hidden;
}

.rating-bar-fill {
    height: 100%;
    background: var(--md-yellow);
    border-radius: 4px;
}

.review-form {
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 24px;
    margin-bottom: 24px;
}

.review-form h2 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 24px;
    color: var(--md-blue-deep);
    margin-bottom: 20px;
}

.review-form form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.review-form input, .review-form textarea, .review-form select {
    padding: 12px 16px;
    border: 2px solid var(--md-border);
    border-radius: 4px;
    font-size: 15px;
    font-family: 'Inter', sans-serif;
}

.review-form textarea {
    min-height: 120px;
    resize: vertical;
}

.review-form button {
    padding: 12px 24px;
    background: var(--md-blue);
    color: var(--md-white);
    border: none;
    border-radius: 4px;
    font-weight: 700;
    cursor: pointer;
    font-family: 'Inter', sans-serif;
    align-self: flex-start;
}

/* ── 404 Page ── */
.error-section {
    padding: 80px 24px;
    text-align: center;
    background: var(--md-bg);
}

.error-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 72px;
    color: var(--md-blue-deep);
    margin-bottom: 16px;
}

.error-text {
    font-size: 18px;
    color: var(--md-muted);
    margin-bottom: 32px;
}

.error-link {
    display: inline-block;
    padding: 12px 24px;
    background: var(--md-blue);
    color: var(--md-white);
    text-decoration: none;
    border-radius: 4px;
    font-weight: 700;
    font-family: 'Inter', sans-serif;
}

.error-link:hover {
    background: var(--md-blue-hover);
}

/* ── Pagination ── */
.pagination {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 32px;
}

.pagination-item {
    display: inline-block;
    padding: 8px 16px;
    border: 1px solid var(--md-border);
    border-radius: 4px;
    text-decoration: none;
    color: var(--md-blue-deep);
    font-size: 14px;
    font-family: 'Inter', sans-serif;
    transition: background 0.2s;
}

.pagination-item:hover {
    background: var(--md-bg);
}

.pagination-item.active {
    background: var(--md-blue);
    color: var(--md-white);
    border-color: var(--md-blue);
}

/* ── Article Content ── */
.article-content {
    max-width: 800px;
    margin: 0 auto;
}

.article-header {
    margin-bottom: 32px;
}

.article-header h1 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 36px;
    color: var(--md-blue-deep);
    margin-bottom: 16px;
    line-height: 1.2;
}

.article-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    font-size: 14px;
    color: var(--md-muted);
    margin-bottom: 24px;
}

.article-body {
    font-size: 16px;
    line-height: 1.7;
    color: var(--md-blue-deep);
}

.article-body h2 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 24px;
    color: var(--md-blue-deep);
    margin: 32px 0 16px;
}

.article-body h3 {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 20px;
    color: var(--md-blue-deep);
    margin: 24px 0 12px;
}

.article-body p {
    margin-bottom: 16px;
}

.article-body ul, .article-body ol {
    margin-bottom: 16px;
    padding-left: 24px;
}

.article-body li {
    margin-bottom: 8px;
}

.article-body blockquote {
    border-left: 4px solid var(--md-blue);
    padding: 16px 20px;
    margin: 24px 0;
    background: var(--md-bg);
    font-style: italic;
}

.article-body img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin: 24px 0;
}

.article-tags {
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid var(--md-border);
}

.article-tags span {
    display: inline-block;
    background: var(--md-bg);
    padding: 4px 12px;
    border-radius: 4px;
    font-size: 13px;
    color: var(--md-muted);
    margin-right: 8px;
    margin-bottom: 8px;
}

/* ── Search Results ── */
.search-results {
    max-width: var(--container-max);
    margin: 0 auto;
}

.search-result-item {
    background: var(--md-white);
    border: 1px solid var(--md-border);
    padding: 24px;
    margin-bottom: 16px;
    transition: transform 0.2s, box-shadow 0.2s;
}

.search-result-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.search-result-title {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 18px;
    color: var(--md-blue-deep);
    margin-bottom: 8px;
}

.search-result-meta {
    font-size: 13px;
    color: var(--md-muted);
    margin-bottom: 8px;
}

.search-result-ico, .search-result-address, .search-result-ds {
    display: inline-block;
    margin-right: 16px;
    font-size: 13px;
    color: var(--md-muted);
}

.search-result-actions {
    margin-top: 12px;
    display: flex;
    gap: 12px;
}

.search-result-actions a {
    font-size: 13px;
    color: var(--md-blue);
    text-decoration: none;
}

.search-result-actions a:hover {
    text-decoration: underline;
}
