/* =============================================================================
   programmatic.css — shared styles for programmatic content pages
   Used by city pages, statute/legal pages, problem-scenario pages,
   and process/comparison pages added in the 100-page content push.
   Loaded AFTER main.css so it can override where needed.
   ============================================================================= */

/* Breadcrumb */
.breadcrumb { background:#f8fafc;border-bottom:1px solid #e5e7eb;padding:10px 0;font-size:.8rem;color:#6b7280; }
.breadcrumb a { color:#0057A8;text-decoration:none; }
.breadcrumb span { margin:0 6px; }

/* Hero — all skeletons share this base */
.hero { background:linear-gradient(135deg,#0a1628 0%,#0057A8 55%,#003d7a 100%);color:#fff;padding:54px 0 40px;text-align:center;position:relative;overflow:hidden; }
.hero h1 { font-size:clamp(1.7rem,4vw,2.4rem);font-weight:900;margin:0 0 10px; }
.hero h1 em { color:#F5A623;font-style:normal; }
.hero .lead { font-size:1.02rem;opacity:.92;max-width:680px;margin:0 auto 20px;line-height:1.65; }
.hero .lead strong { color:#F5A623; }
.hero .cta { display:inline-block;background:#F5A623;color:#0a1628;padding:12px 26px;border-radius:9px;text-decoration:none;font-weight:800; }
.hero .cta:hover { background:#ffba3d; }
.hero .tag { display:inline-block;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);border-radius:24px;padding:6px 16px;font-size:.78rem;font-weight:600;margin-bottom:14px; }

/* Section blocks */
.section { padding:42px 0;background:#fff; }
.section:nth-of-type(even) { background:#f8fafc; }
.section h2 { font-size:1.4rem;font-weight:800;color:#0057A8;margin:0 0 14px; }
.section h3 { font-size:1.05rem;font-weight:700;color:#0a1628;margin:18px 0 8px; }
.section p { color:#374151;font-size:.96rem;line-height:1.7;margin:0 0 14px; }
.section ul, .section ol { color:#374151;font-size:.96rem;line-height:1.7;padding-left:22px;margin:0 0 14px; }
.section li { margin-bottom:6px; }

/* Stat row (Skeleton B data callout) */
.stat-row { display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:18px 0; }
@media(max-width:560px){ .stat-row { grid-template-columns:1fr; } }
.stat { background:#f8fafc;border:1px solid #e5e7eb;border-radius:10px;padding:14px 16px;text-align:center; }
.stat .v { font-size:1.5rem;font-weight:900;color:#0057A8;display:block;line-height:1; }
.stat .l { font-size:.78rem;color:#6b7280;text-transform:uppercase;letter-spacing:.4px;display:block;margin-top:5px; }

/* Step list (Skeleton F step-by-step) */
.steps { list-style:none;padding:0;margin:18px 0;counter-reset:step; }
.steps li { display:flex;gap:14px;align-items:flex-start;padding:12px 0;border-bottom:1px solid #e5e7eb;counter-increment:step; }
.steps li:last-child { border-bottom:none; }
.step-num { flex-shrink:0;width:34px;height:34px;background:#0057A8;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.9rem; }
.step-body strong { display:block;font-size:.94rem;margin-bottom:3px;color:#0a1628; }
.step-body span { font-size:.86rem;color:#6b7280; }

/* Numbered ol with circle counters (Irvine-style) */
.numbered { list-style:none;padding-left:0;counter-reset:s; }
.numbered li { counter-increment:s;margin-bottom:18px;padding-left:48px;position:relative; }
.numbered li::before { content:counter(s);position:absolute;left:0;top:-2px;background:#0057A8;color:#fff;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.9rem; }
.numbered li strong { color:#0a1628; }

/* Competitors block */
.competitors { background:#f8fafc;border-radius:12px;padding:18px 22px;margin:18px 0; }
.competitors h3 { font-size:.95rem;color:#0a1628;margin:0 0 8px;font-weight:700; }
.competitors ul { list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:6px;font-size:.88rem;color:#374151; }
@media(max-width:560px){ .competitors ul { grid-template-columns:1fr; } }
.competitors li { padding-left:18px;position:relative; }
.competitors li::before { content:"•";position:absolute;left:5px;color:#0057A8; }
.competitors .note { font-size:.8rem;color:#6b7280;font-style:italic;margin-top:10px; }

/* Cross-link callout */
.cross-link { background:#fef3c7;border-left:4px solid #d97706;border-radius:0 10px 10px 0;padding:14px 18px;margin:18px 0;font-size:.9rem;color:#78350f; }
.cross-link a { color:#78350f;text-decoration:underline;font-weight:700; }
.cross-link strong { color:#78350f; }

/* Info / alert blocks */
.alert { padding:14px 18px;border-radius:10px;margin:18px 0;font-size:.92rem;line-height:1.6; }
.alert .label { font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.6px;margin-bottom:4px; }
.alert.blue { background:#eff6ff;border-left:4px solid #0057A8;color:#1e3a5f; }
.alert.amber { background:#fef3c7;border-left:4px solid #d97706;color:#78350f; }
.alert.red { background:#fef2f2;border-left:4px solid #dc2626;color:#7f1d1d; }
.alert.green { background:#ecfdf5;border-left:4px solid #16a34a;color:#14532d; }

/* FAQ list */
.faq-list { margin-top:18px; }
.faq-item { background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:14px 18px;margin-bottom:10px; }
.faq-item h3 { font-size:.96rem;font-weight:700;color:#0a1628;margin:0 0 6px; }
.faq-item p { font-size:.9rem;color:#374151;margin:0; }

/* Data table (Skeleton B / E) */
.data-table { width:100%;border-collapse:collapse;margin:18px 0;font-size:.92rem; }
.data-table thead tr { background:#f1f5f9;text-align:left; }
.data-table th, .data-table td { padding:10px;border:1px solid #e5e7eb; }
.data-table th { font-weight:700;color:#0a1628; }

/* Resource list closer (Skeleton B) */
.resource-list { list-style:none;padding:0;margin:0; }
.resource-list li { padding:10px 0;border-bottom:1px solid #e5e7eb; }
.resource-list li:last-child { border-bottom:none; }
.resource-list a { color:#0057A8;text-decoration:none;font-weight:600; }
.resource-list a:hover { text-decoration:underline; }

/* CTA strip */
.cta-strip { background:linear-gradient(135deg,#003e7e 0%,#0057A8 100%);color:#fff;padding:42px 0;text-align:center; }
.cta-strip h2 { font-size:1.4rem;font-weight:800;margin:0 0 8px;color:#fff; }
.cta-strip p { opacity:.88;margin:0 auto 18px;max-width:560px;color:#fff;font-size:.96rem; }
.cta-strip a { display:inline-block;background:#F5A623;color:#0a1628;padding:13px 28px;border-radius:9px;font-weight:800;text-decoration:none;margin:0 6px; }
.cta-strip a.alt { background:transparent;border:2px solid rgba(255,255,255,.4);color:#fff; }
.cta-strip a.alt:hover { background:rgba(255,255,255,.08); }

/* Related links footer */
.related-pages { padding:36px 0;background:#f8fafc;border-top:1px solid #e5e7eb; }
.related-pages h2 { font-size:1.1rem;font-weight:800;color:#0057A8;margin:0 0 14px; }
.related-pages ul { list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:8px; }
.related-pages a { display:block;padding:10px 14px;background:#fff;border:1px solid #e5e7eb;border-radius:8px;text-decoration:none;color:#0057A8;font-size:.88rem;font-weight:600; }
.related-pages a:hover { border-color:#0057A8; }