/* pages.css — shared styles for profession, local, scenario, and guide pages */

/* EEAT author block */
.eeat-section { background:var(--bg-card); border-top:1px solid var(--border); padding:var(--space-xl) 0; }
.eeat-block { border-left:3px solid var(--teal); padding-left:var(--space-lg); max-width:680px; }
.eeat-name { font-family:var(--font-headline); font-size:1.125rem; font-weight:600; color:var(--text-white); margin-bottom:0.25rem; }
.eeat-creds { font-family:var(--font-mono); font-size:0.8125rem; color:var(--teal); margin-bottom:var(--space-sm); }
.eeat-bio { color:var(--text-muted); font-size:0.9375rem; line-height:1.7; margin-bottom:var(--space-sm); }
.eeat-reviewed { font-size:0.8125rem; color:var(--text-muted); font-style:italic; }

/* Internal arrow link */
.internal-link { display:inline-block; color:var(--teal); text-decoration:none; font-size:0.9375rem; font-weight:500; margin-top:var(--space-md); }
.internal-link:hover { text-decoration:underline; }

/* Two-column list (roles, disciplines) — designed for section-light */
.two-col-list { list-style:none; display:grid; grid-template-columns:1fr; gap:0.5rem; margin-top:var(--space-lg); max-width:780px; }
.two-col-list li { padding:0.75rem var(--space-md); background:#fff; border:1px solid #E5E7EB; border-left:3px solid var(--teal); color:#374151; font-size:0.9375rem; }
@media (min-width:640px) { .two-col-list { grid-template-columns:repeat(2,1fr); } }

/* Borrowing examples table — designed for dark sections */
.borrow-table-wrap { overflow-x:auto; max-width:680px; margin-top:var(--space-lg); }
.borrow-table { width:100%; border-collapse:collapse; }
.borrow-table th { text-align:left; padding:0.625rem var(--space-md); font-family:var(--font-mono); font-size:0.7rem; text-transform:uppercase; letter-spacing:0.06em; color:var(--teal); border-bottom:1px solid var(--border); }
.borrow-table td { padding:0.75rem var(--space-md); border-bottom:1px solid var(--border); font-size:0.9rem; color:var(--text-muted); }
.borrow-table td:first-child { font-family:var(--font-mono); font-weight:600; color:var(--text-white); }
.borrow-table td:last-child { font-family:var(--font-mono); font-weight:600; color:var(--teal); }
.borrow-table tbody tr:last-child td { border-bottom:none; }

/* Numbered steps list */
.numbered-steps { list-style:none; display:flex; flex-direction:column; gap:var(--space-sm); max-width:720px; margin-top:var(--space-lg); counter-reset:step-counter; }
.numbered-steps li { display:flex; gap:var(--space-md); padding:var(--space-md) var(--space-lg); background:var(--bg-card); border:1px solid var(--border); counter-increment:step-counter; align-items:flex-start; color:var(--text-muted); font-size:0.9375rem; line-height:1.7; }
.numbered-steps li::before { content:counter(step-counter); font-family:var(--font-mono); font-size:1.125rem; font-weight:700; color:var(--teal); flex-shrink:0; min-width:1.5rem; line-height:1.4; }
.section-light .numbered-steps li { background:#fff; border-color:#E5E7EB; color:#374151; }

/* Checklist items (contractor-mortgage-documents) — designed for section-light */
.checklist { display:flex; flex-direction:column; gap:0.5rem; max-width:760px; margin-top:var(--space-lg); }
.check-item { display:flex; gap:var(--space-md); padding:var(--space-md); background:#fff; border:1px solid #E5E7EB; align-items:flex-start; }
.check-icon { font-size:1.125rem; color:var(--teal); flex-shrink:0; line-height:1.5; }
.check-body { flex:1; }
.check-body strong { color:var(--text-dark); display:block; margin-bottom:0.25rem; font-size:0.9375rem; }
.check-body p, .check-body span { margin:0; font-size:0.875rem; color:#6B7280; line-height:1.6; }
.check-note { font-size:0.8125rem; color:var(--text-muted); font-style:italic; margin-top:var(--space-sm); max-width:760px; }
.section-card .check-item { background:var(--bg-dark); border-color:var(--border); }
.section-card .check-body strong { color:var(--text-white); }
.section-card .check-body p { color:var(--text-muted); }

/* Two-route split (day rate vs CIS in construction page) */
.two-route-grid { display:grid; grid-template-columns:1fr; gap:var(--space-md); margin-top:var(--space-lg); max-width:820px; }
.route-card { background:var(--bg-card); border:1px solid var(--border); border-top:2px solid var(--teal); padding:var(--space-lg); }
.route-card h3 { margin-bottom:var(--space-sm); font-size:1.0625rem; }
.route-card p { color:var(--text-muted); font-size:0.9375rem; line-height:1.7; margin:0; }
@media (min-width:768px) { .two-route-grid { grid-template-columns:repeat(2,1fr); } }

/* Worked example monospace box */
.worked-example { background:var(--bg-card); border:1px solid var(--border); border-left:3px solid var(--teal); padding:var(--space-lg); max-width:640px; margin-top:var(--space-lg); }
.worked-example pre { font-family:var(--font-mono); font-size:0.875rem; white-space:pre-wrap; color:var(--text-muted); line-height:2; margin:0; }
.worked-example .we-note { margin-top:var(--space-sm); font-size:0.8125rem; color:var(--text-muted); font-style:italic; }

/* Strengthen/bullet list (mortgage-between-contracts) */
.strengthen-list { list-style:none; display:flex; flex-direction:column; gap:var(--space-sm); max-width:720px; margin-top:var(--space-lg); }
.strengthen-list li { padding:var(--space-md) var(--space-lg); background:var(--bg-card); border:1px solid var(--border); border-left:3px solid var(--teal); color:var(--text-muted); font-size:0.9375rem; line-height:1.7; }
.strengthen-list li strong { color:var(--text-white); display:block; margin-bottom:0.25rem; }

/* Numbers comparison callout (umbrella-company-mortgage) */
.numbers-callout { background:var(--bg-card); border:1px solid var(--border); border-left:3px solid var(--teal); padding:var(--space-lg); max-width:640px; margin-top:var(--space-lg); font-family:var(--font-mono); font-size:0.875rem; }
.numbers-callout p { color:var(--text-muted); margin:0; line-height:2.2; }
.numbers-callout .nc-highlight { color:var(--teal); font-weight:600; }
.numbers-callout .nc-diff { color:var(--text-white); font-weight:600; border-top:1px solid var(--border); margin-top:0.75rem; padding-top:0.75rem; }
