.landing-page{display:block}
.landing-page .shell{max-width:1180px;margin:0 auto;padding:22px 24px 28px;display:grid;gap:20px}
.landing-page .topbar{background:var(--navy);border:1px solid #2a3a5f;box-shadow:0 14px 36px rgba(15,23,42,.24);border-radius:16px;padding:14px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.landing-page .brand-wrap{display:flex;align-items:center;gap:12px}
.landing-page .mk{width:38px;height:38px;background:var(--teal);border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:800;color:#fff;font-size:16px;flex-shrink:0}
.landing-page .brand{color:#f1f5f9;font-weight:700;font-size:1rem;letter-spacing:-.2px}
.landing-page .brand span{display:block;color:#8ea0bf;font-size:.73rem;font-weight:500;margin-top:1px}
.landing-page .landing-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.landing-page .status{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:#9fb0ca;background:rgba(148,163,184,.14);padding:6px 10px;border-radius:999px}
.landing-page .routes{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.landing-page .route-card{background:var(--card);border:1px solid var(--brd);border-radius:16px;padding:24px 24px 22px;text-decoration:none;color:inherit;transition:.22s ease;display:flex;flex-direction:column;box-shadow:0 10px 30px rgba(15,23,42,.05)}
.landing-page .route-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(15,23,42,.13);border-color:rgba(13,148,136,.34)}
.landing-page .route-card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.landing-page .route-card-icon{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center}
.landing-page .route-card-icon svg{width:24px;height:24px}
.landing-page .route-card.frontend .route-card-icon{background:rgba(13,148,136,.1);color:var(--teal)}
.landing-page .route-card.backend .route-card-icon{background:rgba(37,99,235,.1);color:var(--blue)}
.landing-page .route-pill{font-size:.64rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--tx3);background:#f1f5f9;padding:4px 8px;border-radius:999px}
.landing-page .route-card h2{font-family:var(--fd);font-size:1.3rem;letter-spacing:-.2px;margin-bottom:4px}
.landing-page .route-role{font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.55px;color:var(--tx3);margin-bottom:10px}
.landing-page .route-card p{font-size:.84rem;color:var(--tx2);line-height:1.65;margin-bottom:15px}
.landing-page .route-tag-wrap{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.landing-page .route-tag{font-size:.65rem;font-weight:600;padding:4px 9px;border-radius:999px;background:#f1f5f9;color:#64748b}
.landing-page .route-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 15px;border-radius:9px;font-size:.82rem;font-weight:700;margin-top:auto;width:fit-content;color:#fff}
.landing-page .route-card.frontend .route-btn{background:var(--teal)}
.landing-page .route-card.backend .route-btn{background:var(--blue)}
.landing-page .footer{text-align:center;color:var(--tx3);font-size:.72rem;padding-top:6px}
@media(max-width:980px){.landing-page .routes{grid-template-columns:1fr}}
@media(max-width:620px){.landing-page .topbar{padding:12px 14px}}