/* =============================================================
   SITEMAP PAGE - CalcLeaf brand
   Uses the same CSS custom properties as tool.css/blog.css
   (--teal, --navy, --border, --radius, --white, --text2, etc.)
   ============================================================= */

.sm-wrap{max-width:var(--container, 1080px);margin:0 auto;}

/* Breadcrumb styling now lives solely in the global calcleaf.css,
   so this page's breadcrumb stays consistent with every other page
   without needing its own copy. */

.sm-hero{
    text-align:center;padding:8px 0 32px;margin-bottom:8px;
    border-bottom:1px solid var(--border, #e5e7eb);
}
.sm-hero-eyebrow{
    display:inline-block;font-size:11px;font-weight:700;text-transform:uppercase;
    letter-spacing:0.08em;color:var(--teal, #00c9a7);margin-bottom:10px;
}
.sm-hero h1{
    font-size:32px;font-weight:800;color:var(--navy, #1e2a4a);margin:0 0 10px;
    letter-spacing:-0.01em;line-height:1.2;
    font-family:var(--font-main, inherit);
}
.sm-hero p{font-size:15px;color:var(--text2, #6b7280);margin:0;}

.sm-section-title{
    font-size:20px;font-weight:800;color:var(--navy, #1e2a4a);
    margin:36px 0 18px;letter-spacing:-0.01em;
    font-family:var(--font-main, inherit);
}
.sm-section-title:first-of-type{margin-top:28px;}

.sm-grid{
    display:grid;grid-template-columns:repeat(3, 1fr);gap:22px;
}

.sm-card{
    background:var(--white, #ffffff);border:1px solid var(--border, #e5e7eb);
    border-radius:var(--radius, 14px);overflow:hidden;
    box-shadow:0 1px 2px rgba(16,24,40,0.04);
}
.sm-card-header{
    font-size:14px;font-weight:700;color:#fff;
    background:var(--navy, #1e2a4a);
    padding:13px 18px;
}
.sm-card-header a{color:#fff;text-decoration:none;}
.sm-card-header a:hover{text-decoration:underline;}

.sm-list{list-style:none;margin:0;padding:10px 0 12px;}
.sm-list li{margin-bottom:0;}
.sm-list a{
    display:flex;align-items:center;gap:8px;
    padding:9px 18px;
    color:var(--text2, #374151);text-decoration:none;font-size:13.5px;font-weight:500;
    transition:background 0.2s, color 0.2s;
}
.sm-list-icon{
    display:inline-flex;align-items:center;justify-content:center;
    width:16px;height:16px;flex-shrink:0;color:var(--teal, #00c9a7);
}
.sm-list-icon svg{width:15px;height:15px;}
.sm-list a:hover{background:#f0fdf9;color:var(--teal, #00c9a7);}

.sm-other{margin-top:36px;}
.sm-other-list{
    list-style:none;margin:0;padding:0;
    display:flex;flex-wrap:wrap;gap:10px;
}
.sm-other-list a{
    display:inline-block;padding:9px 18px;border-radius:999px;
    background:var(--white, #ffffff);border:1px solid var(--border, #e5e7eb);
    color:var(--text2, #374151);text-decoration:none;font-size:13.5px;font-weight:600;
    transition:background 0.2s, color 0.2s, border-color 0.2s;
}
.sm-other-list a:hover{
    background:#f0fdf9;color:var(--teal, #00c9a7);border-color:#c7f3e8;
}

@media (max-width:860px){
    .sm-grid{grid-template-columns:repeat(2, 1fr);}
}
@media (max-width:560px){
    .sm-grid{grid-template-columns:1fr;}
    .sm-hero h1{font-size:24px;}
}