.cds-hub,
.cds-single-wrap,
.cds-form-wrap,
.cds-article {
--cds-navy: var(--cd-brand-navy, #0b1f4d);
--cds-navy-mid: var(--cd-brand-navy-mid, #1e3a5f);
--cds-rose: var(--cd-brand-rose, #e84a7f);
--cds-muted: var(--cd-brand-muted, #465466);
--cds-surface: var(--cd-brand-surface, #fff);
--cds-surface-muted: var(--cd-brand-surface-muted, #f4f6f9);
--cds-border: var(--cd-brand-border, rgba(11, 31, 77, 0.2));
box-sizing: border-box;
max-width: 1120px;
margin: 0 auto;
padding: 1rem;
color: var(--cds-navy);
}
.cds-hub *,
.cds-single-wrap *,
.cds-form-wrap *,
.cds-article * {
box-sizing: border-box;
}
.cds-hub__brand,
.cds-single__brand,
.cds-form-wrap .cds-hub__brand {
font-size: 0.85rem;
font-weight: 700;
letter-spacing: 0.04em;
text-transform: uppercase;
color: var(--cds-rose);
margin: 0 0 0.35rem;
}
.cds-hub__title,
.cds-article__title,
.cds-form-wrap h1 {
font-size: clamp(1.45rem, 4.5vw, 2.1rem);
line-height: 1.2;
margin: 0 0 0.75rem;
color: var(--cds-navy);
}
.cds-hub__lead,
.cds-hub__disclaimer,
.cds-single__fineprint {
color: var(--cds-muted);
font-size: 0.95rem;
line-height: 1.5;
}
.cds-hub__disclaimer {
padding: 0.75rem 0.9rem;
background: var(--cds-surface-muted);
border-left: 3px solid var(--cds-rose);
margin: 1rem 0;
}
.cds-btn {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 44px;
padding: 0.65rem 1.1rem;
border-radius: 8px;
border: 1px solid var(--cds-border);
font-weight: 600;
text-decoration: none;
cursor: pointer;
line-height: 1.2;
}
.cds-btn:focus-visible,
.cds-card__link:focus-visible,
.cds-form a:focus-visible,
.cds-hub a:focus-visible,
.cds-single a:focus-visible,
.cds-form input:focus-visible,
.cds-form select:focus-visible,
.cds-form textarea:focus-visible,
.cds-filters input:focus-visible,
.cds-filters select:focus-visible {
outline: 3px solid var(--cds-rose);
outline-offset: 2px;
}
.cds-btn--primary {
background: var(--cds-rose);
border-color: #d63d72;
color: #fff;
}
.cds-btn--primary:hover {
background: #d63d72;
color: #fff;
}
.cds-btn--secondary {
background: var(--cds-navy-mid);
border-color: var(--cds-navy-mid);
color: #fff;
}
.cds-btn--ghost {
background: var(--cds-surface);
color: var(--cds-navy);
}
.cds-filters {
display: flex;
flex-direction: column;
gap: 0.75rem;
margin: 1.25rem 0 1.5rem;
padding: 1rem;
background: var(--cds-surface-muted);
border: 1px solid var(--cds-border);
border-radius: 12px;
}
.cds-filters__field {
display: flex;
flex-direction: column;
gap: 0.35rem;
font-size: 0.9rem;
}
.cds-filters__field input,
.cds-filters__field select,
.cds-form input,
.cds-form select,
.cds-form textarea {
width: 100%;
min-height: 44px;
padding: 0.55rem 0.7rem;
border: 1px solid var(--cds-border);
border-radius: 8px;
font: inherit;
background: var(--cds-surface);
}
.cds-form textarea {
min-height: 120px;
}
.cds-grid {
list-style: none;
margin: 0;
padding: 0;
display: grid;
grid-template-columns: 1fr;
gap: 1rem;
}
.cds-card {
border: 1px solid var(--cds-border);
border-radius: 12px;
overflow: hidden;
background: var(--cds-surface);
}
.cds-card__link {
display: flex;
flex-direction: column;
color: inherit;
text-decoration: none;
height: 100%;
}
.cds-card__media {
aspect-ratio: 16 / 9;
background: linear-gradient(135deg, #0b1f4d 0%, #1e3a5f 55%, #e84a7f 140%);
overflow: hidden;
}
.cds-card__media img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
} .cds-article__hero img {
display: block;
width: 100%;
max-width: min(100%, 560px);
height: auto;
object-fit: contain;
object-position: center center;
margin: 0 auto;
background: var(--cds-surface-muted);
}
.cds-card__body {
padding: 0.9rem 1rem 1.1rem;
}
.cds-card__type {
margin: 0 0 0.35rem;
font-size: 0.75rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.03em;
color: var(--cds-rose);
}
.cds-card__title {
font-size: 1.05rem;
margin: 0 0 0.4rem;
line-height: 1.3;
}
.cds-card__geo,
.cds-card__excerpt {
margin: 0.25rem 0;
color: var(--cds-muted);
font-size: 0.92rem;
}
.cds-badge {
display: inline-block;
margin-top: 0.5rem;
padding: 0.2rem 0.55rem;
border-radius: 999px;
font-size: 0.75rem;
font-weight: 700;
background: var(--cds-surface-muted);
}
.cds-badge--closed {
background: #ffe8e8;
color: #8a1f1f;
}
.cds-badge--reviewed {
background: #e8f2ff;
color: var(--cds-navy);
}
.cds-empty,
.cds-notice {
padding: 1rem;
border-radius: 10px;
margin: 1rem 0;
}
.cds-notice--ok {
background: #e9f8ef;
border: 1px solid #b7e0c5;
}
.cds-notice--info {
background: #eef3fb;
border: 1px solid #c5d4ea;
}
.cds-single__meta {
list-style: none;
margin: 1rem 0;
padding: 0;
display: grid;
gap: 0.45rem;
}
.cds-article__hero {
margin: 0 0 1rem;
border-radius: 12px;
overflow: hidden;
max-width: 100%;
background: var(--cds-surface-muted);
}
.cds-single__source {
margin: 1rem 0 0;
}
.cds-single__witness {
margin: 1.5rem 0;
padding: 1rem 1.1rem;
border: 1px solid var(--cds-border);
border-radius: 10px;
background: var(--cds-surface);
}
.cds-single__witness h2 {
margin: 0 0 0.65rem;
font-size: 1.1rem;
color: var(--cds-navy);
}
.cds-article__content .cds-source-quote {
margin: 1rem 0;
padding: 0.85rem 1rem;
border-left: 3px solid var(--cds-rose);
background: var(--cds-surface-muted);
}
.cds-article__content .cds-source-quote p {
margin: 0 0 0.75rem;
}
.cds-article__content .cds-source-quote p:last-child {
margin-bottom: 0;
}
.cds-form {
display: grid;
gap: 0.9rem;
margin-top: 1rem;
}
.cds-form__field {
display: grid;
gap: 0.35rem;
}
.cds-form__check {
display: grid;
grid-template-columns: auto 1fr;
gap: 0.65rem;
align-items: start;
}
.cds-form__check input {
width: 1.15rem;
height: 1.15rem;
min-height: 0;
margin-top: 0.2rem;
}
.cds-form__help {
margin: 0;
font-size: 0.85rem;
color: var(--cds-muted);
}
.cds-report {
margin: 2rem 0 1rem;
padding: 0.75rem 0;
border-top: 1px solid var(--cds-border);
}
.cds-pagination {
margin: 1.5rem 0;
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
}
.cds-pagination .page-numbers {
min-width: 44px;
min-height: 44px;
display: inline-flex;
align-items: center;
justify-content: center;
border: 1px solid var(--cds-border);
border-radius: 8px;
text-decoration: none;
color: var(--cds-navy);
padding: 0 0.6rem;
}
.cds-pagination .current {
background: var(--cds-navy-mid);
color: #fff;
border-color: var(--cds-navy-mid);
}
@media (min-width: 768px) {
.cds-filters {
flex-direction: row;
flex-wrap: wrap;
align-items: end;
}
.cds-filters__field {
min-width: 160px;
}
.cds-filters__field--grow {
flex: 1 1 220px;
}
.cds-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (min-width: 1024px) {
.cds-grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.cds-hub,
.cds-single-wrap,
.cds-form-wrap {
padding: 1.5rem 1.25rem 2.5rem;
}
}
@media (max-width: 320px) {
.cds-hub,
.cds-single-wrap,
.cds-form-wrap {
padding: 0.75rem;
}
.cds-btn {
width: 100%;
}
}
@media (max-width: 280px) {
.cds-hub__title {
font-size: 1.25rem;
}
}