/* ═══════════════════════════════════════════
1. IMPORTS — Google Fonts
Fonts are enqueued in functions.php (Barlow Condensed + DM Sans)
so they load with proper resource hints. No @import here.
═══════════════════════════════════════════ */
/* ═══════════════════════════════════════════
2. TOKENS — All CSS custom properties
═══════════════════════════════════════════ */
html { font-size: 18px; } /* 1rem = 18px sitewide — deliberate readability decision */
:root {
/* Brand */
--cw-navy: #0C1828;
--cw-primary: #0068B6;
--cw-primary-mid: #3B9BE8;
--cw-primary-dark: #00467A;
--cw-primary-light: #E6F2FB;
/* Neutrals */
--cw-white: #FFFFFF;
--cw-off-white: #F4F6F9;
--cw-surface: #FFFFFF;
--cw-surface-alt: #F8FAFC;
--cw-text: #1A202C;
--cw-muted: #374151;
--cw-border: #E2E8F0;
/* Semantic */
--cw-emergency: #DC2626;
--cw-emergency-bg: rgba(220, 38, 38, 0.08);
--cw-success: #16A34A;
/* Dark surface text */
--cw-on-dark: rgba(255, 255, 255, 1.00);
--cw-on-dark-secondary: rgba(255, 255, 255, 0.72);
--cw-on-dark-muted: rgba(255, 255, 255, 0.45);
--cw-on-dark-faint: rgba(255, 255, 255, 0.28);
--cw-on-dark-border: rgba(255, 255, 255, 0.08);
--cw-on-dark-surface: rgba(255, 255, 255, 0.05);
/* Fonts */
--cw-font-heading: 'Barlow Condensed', sans-serif;
--cw-font-body: 'DM Sans', sans-serif;
/* Weights */
--cw-weight-light: 300;
--cw-weight-regular: 400;
--cw-weight-medium: 500;
--cw-weight-semibold: 600;
--cw-weight-bold: 700;
--cw-weight-extrabold: 800;
/* Interior page type */
--cw-text-page-h1: clamp(2rem, 5vw, 3.25rem);
--cw-text-section-h2: clamp(1.75rem, 4vw, 2.5rem);
--cw-text-card-h3: clamp(1.25rem, 3vw, 1.875rem);
/* UI type */
--cw-text-eyebrow: 0.6875rem;
--cw-text-button: 1rem;
--cw-text-nav: 0.9375rem;
/* Body type */
--cw-text-lead: 1.125rem;
--cw-text-body: 1rem;
--cw-text-sm: 0.9375rem;
--cw-text-xs: 0.875rem;
--cw-text-2xs: 0.8125rem;
--cw-text-3xs: 0.75rem;
--cw-text-label: 0.6875rem;
/* Line heights */
--cw-leading-tight: 1.1;
--cw-leading-snug: 1.25;
--cw-leading-normal: 1.5;
--cw-leading-relaxed: 1.75;
/* Letter spacing */
--cw-tracking-eyebrow: 1.5px;
--cw-tracking-button: 0.5px;
--cw-tracking-label: 1.5px;
--cw-tracking-wide: 1px;
/* Spacing — 8pt */
--cw-space-2xs: 4px;
--cw-space-xs: 8px;
--cw-space-sm: 16px;
--cw-space-md: 24px;
--cw-space-lg: 32px;
--cw-space-xl: 48px;
--cw-space-2xl: 64px;
--cw-space-section: 80px;
/* Layout */
--cw-container: 1200px;
--cw-container-sm: 760px;
--cw-gutter: clamp(20px, 4vw, 40px);
/* Radius */
--cw-radius-sm: 4px;
--cw-radius-md: 8px;
--cw-radius-lg: 16px;
--cw-radius-pill: 100px;
/* Shadows */
--cw-shadow-card: 0 2px 12px rgba(0, 0, 0, 0.08);
--cw-shadow-lifted: 0 4px 24px rgba(0, 0, 0, 0.12);
--cw-shadow-overlay: 0 8px 32px rgba(0, 0, 0, 0.24);
/* Transitions */
--cw-ease: 0.2s ease;
--cw-ease-md: 0.3s ease;
/* Z-index */
--cw-z-base: 1;
--cw-z-raised: 10;
--cw-z-header: 1000;
--cw-z-overlay: 9000;
--cw-z-modal: 9100;
}
/* ═══════════════════════════════════════════
3. RESET
═══════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img, picture, svg, video { display: block; max-width: 100%; height: auto; }
input, button, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: none; }
ul, ol { list-style: none; padding: 0; }
a { text-decoration: none; color: inherit; }
/* ═══════════════════════════════════════════
4. BASE
═══════════════════════════════════════════ */
body {
font-family: var(--cw-font-body);
font-size: var(--cw-text-body);
font-weight: var(--cw-weight-regular);
line-height: var(--cw-leading-relaxed);
color: var(--cw-text);
background: var(--cw-off-white);
}
h1, h2, h3, h4, h5, h6 {
font-family: var(--cw-font-heading);
font-weight: var(--cw-weight-extrabold);
text-transform: uppercase;
line-height: var(--cw-leading-tight);
color: var(--cw-navy);
}
h1 { font-size: clamp(2rem, 6vw, 3.75rem); }
h2 { font-size: clamp(1.75rem, 4vw, 2.75rem); line-height: var(--cw-leading-snug); }
h3 { font-size: clamp(1.25rem, 3vw, 1.875rem); line-height: var(--cw-leading-snug); }
h4 { font-size: clamp(1.125rem, 2.5vw, 1.5rem); line-height: var(--cw-leading-snug); }
h5 { font-size: 1.125rem; }
h6 { font-size: 1rem; }
p { color: var(--cw-muted); }
strong { font-weight: var(--cw-weight-bold); color: var(--cw-text); }
:focus-visible { outline: 3px solid var(--cw-primary-mid); outline-offset: 2px; }
/* ═══════════════════════════════════════════
5. LAYOUT — containers, grid, sections
═══════════════════════════════════════════ */
.cw-container {
width: 100%;
max-width: var(--cw-container);
margin-inline: auto;
padding-inline: var(--cw-gutter);
}
.cw-container--narrow { max-width: var(--cw-container-sm); }
.cw-section { padding-block: var(--cw-space-section); }
.cw-section--tight { padding-block: var(--cw-space-2xl); }
.cw-section--alt { background: var(--cw-surface-alt); }
.cw-section--dark { background: var(--cw-navy); }
.cw-section--dark :is(h1, h2, h3, h4, h5, h6) { color: var(--cw-on-dark); }
.cw-section--dark p { color: var(--cw-on-dark-secondary); }
.cw-grid { display: grid; gap: var(--cw-space-lg); }
.cw-grid--2 { grid-template-columns: repeat(2, 1fr); }
.cw-grid--3 { grid-template-columns: repeat(3, 1fr); }
.cw-grid--4 { grid-template-columns: repeat(4, 1fr); }
/* ═══════════════════════════════════════════
6. TYPOGRAPHY — eyebrow, lead, section heads
═══════════════════════════════════════════ */
.cw-eyebrow {
display: inline-block;
font-family: var(--cw-font-body);
font-weight: var(--cw-weight-semibold);
font-size: 0.8125rem;
text-transform: uppercase;
letter-spacing: var(--cw-tracking-eyebrow);
color: var(--cw-primary);
margin-bottom: var(--cw-space-sm);
}
.cw-section--dark .cw-eyebrow { color: var(--cw-primary-mid); }
.cw-lead {
font-size: var(--cw-text-lead);
font-weight: var(--cw-weight-light);
line-height: var(--cw-leading-normal);
color: var(--cw-muted);
}
.cw-section--dark .cw-lead { color: var(--cw-on-dark-secondary); }
.cw-section__head { max-width: 760px; margin-bottom: var(--cw-space-xl); }
.cw-accent { color: var(--cw-primary); }
.cw-section--dark .cw-accent { color: var(--cw-primary-mid); }
/* ═══════════════════════════════════════════
7. BUTTONS
═══════════════════════════════════════════ */
.cw-btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: var(--cw-space-xs);
font-family: var(--cw-font-heading);
font-weight: var(--cw-weight-bold);
font-size: var(--cw-text-button);
text-transform: uppercase;
letter-spacing: var(--cw-tracking-button);
line-height: var(--cw-leading-normal);
padding: 0.78rem 1.6rem;
border-radius: var(--cw-radius-md);
border: 2px solid transparent;
transition: background var(--cw-ease), color var(--cw-ease), border-color var(--cw-ease), transform var(--cw-ease);
}
.cw-btn:hover { transform: translateY(-1px); }
.cw-btn--primary { background: var(--cw-primary); color: var(--cw-white); }
.cw-btn--primary:hover { background: var(--cw-primary-dark); }
.cw-btn--ghost { background: transparent; color: var(--cw-navy); border-color: var(--cw-border); }
.cw-btn--ghost:hover { border-color: var(--cw-primary); color: var(--cw-primary); }
.cw-btn--on-dark { background: transparent; color: var(--cw-on-dark); border-color: rgba(255, 255, 255, 0.5); }
.cw-btn--on-dark:hover { background: var(--cw-on-dark-surface); border-color: var(--cw-on-dark-secondary); }
.cw-btn--block { width: 100%; }
/* ═══════════════════════════════════════════
8. FORMS — inputs, labels (Gravity Forms styled in §15)
═══════════════════════════════════════════ */
.cw-field-label {
display: block;
font-family: var(--cw-font-body);
font-weight: var(--cw-weight-bold);
font-size: var(--cw-text-label);
text-transform: uppercase;
letter-spacing: var(--cw-tracking-label);
color: var(--cw-muted);
margin-bottom: var(--cw-space-2xs);
}
.cw-input,
.cw-textarea,
.cw-select {
width: 100%;
font-size: var(--cw-text-body);
color: var(--cw-text);
background: var(--cw-white);
border: 1px solid var(--cw-border);
border-radius: var(--cw-radius-md);
padding: 0.7rem 0.9rem;
transition: border-color var(--cw-ease), box-shadow var(--cw-ease);
}
.cw-input:focus,
.cw-textarea:focus,
.cw-select:focus {
outline: none;
border-color: var(--cw-primary);
box-shadow: 0 0 0 3px var(--cw-primary-light);
}
/* ═══════════════════════════════════════════
9. CARDS
═══════════════════════════════════════════ */
.cw-card {
background: var(--cw-surface);
border: 1px solid var(--cw-border);
border-radius: var(--cw-radius-lg);
padding: var(--cw-space-lg);
box-shadow: var(--cw-shadow-card);
transition: box-shadow var(--cw-ease), transform var(--cw-ease);
}
.cw-card__title { font-size: var(--cw-text-card-h3); margin-bottom: var(--cw-space-xs); }
.cw-cards--4 .cw-card__title { font-size: var(--cw-text-lead); } /* smaller titles in the 4-up grid so they don't wrap to 3 lines */
.cw-card__body { color: var(--cw-muted); font-size: var(--cw-text-sm); }
.cw-card__link {
display: inline-block;
margin-top: var(--cw-space-sm);
font-weight: var(--cw-weight-semibold);
color: var(--cw-primary);
}
.cw-card__link:hover { color: var(--cw-primary-dark); }
.cw-card--link:hover { box-shadow: var(--cw-shadow-lifted); transform: translateY(-2px); }
.cw-card--on-dark {
background: var(--cw-on-dark-surface);
border-color: var(--cw-on-dark-border);
box-shadow: none;
}
.cw-card--on-dark .cw-card__title { color: var(--cw-on-dark); }
.cw-card--on-dark .cw-card__body { color: var(--cw-on-dark-secondary); }
.cw-card--navy { background: var(--cw-navy); border-color: var(--cw-navy); box-shadow: none; }
.cw-card--navy .cw-card__title { color: var(--cw-on-dark); }
.cw-card--navy .cw-card__body { color: var(--cw-on-dark-secondary); }
.cw-card--navy .cw-eyebrow { color: var(--cw-primary-mid); }
.cw-card__btn { margin-top: var(--cw-space-md); }
/* CTA highlight card (e.g. "Not sure where to start?") */
.cw-card--cta {
background: var(--cw-navy);
border-color: transparent;
box-shadow: var(--cw-shadow-lifted);
}
.cw-card--cta .cw-card__title { color: var(--cw-on-dark); }
.cw-card--cta .cw-card__body { color: var(--cw-on-dark-secondary); }
.cw-card--cta .cw-card__link { color: var(--cw-primary-mid); }
.cw-card--cta .cw-card__link:hover { color: var(--cw-primary-light); }
/* ═══════════════════════════════════════════
10. NAVIGATION — header, drawer, dropdowns
═══════════════════════════════════════════ */
.cw-topbar {
background: var(--cw-navy);
color: var(--cw-on-dark-secondary);
font-size: var(--cw-text-2xs);
}
.cw-topbar__inner {
max-width: var(--cw-container);
margin-inline: auto;
padding: var(--cw-space-2xs) var(--cw-gutter);
display: flex;
justify-content: flex-end;
gap: var(--cw-space-xs);
align-items: center;
}
.cw-topbar a { color: var(--cw-primary-mid); font-weight: var(--cw-weight-semibold); }
@media (max-width: 600px) {
.cw-topbar__inner { justify-content: center; }
.cw-topbar span { display: none; } /* small screens: keep the tap-to-call phone only */
}
.cw-header {
position: sticky;
top: 0;
z-index: var(--cw-z-header);
background: var(--cw-navy);
}
.cw-header__inner {
max-width: var(--cw-container);
margin-inline: auto;
padding: var(--cw-space-sm) var(--cw-gutter);
display: flex;
align-items: center;
gap: var(--cw-space-lg);
}
.cw-brand { display: flex; align-items: center; flex-shrink: 0; }
.cw-brand img { max-height: 46px; width: auto; height: auto; }
.cw-nav { margin-left: auto; }
.cw-nav__menu { display: flex; align-items: center; gap: var(--cw-space-md); }
.cw-nav__link {
font-family: var(--cw-font-body);
font-weight: var(--cw-weight-medium);
font-size: var(--cw-text-nav);
color: var(--cw-on-dark);
padding-block: var(--cw-space-xs);
transition: color var(--cw-ease);
}
.cw-nav__link:hover { color: var(--cw-primary-mid); }
/* Dropdowns */
.cw-nav__item--has-dropdown { position: relative; }
.cw-nav__dropdown {
position: absolute;
top: 100%;
left: 0;
min-width: 260px;
background: var(--cw-white);
border: 1px solid var(--cw-border);
border-radius: var(--cw-radius-md);
box-shadow: var(--cw-shadow-overlay);
padding: var(--cw-space-xs);
opacity: 0;
visibility: hidden;
transform: translateY(6px);
transition: opacity var(--cw-ease), transform var(--cw-ease), visibility var(--cw-ease);
z-index: var(--cw-z-overlay);
}
.cw-nav__item--has-dropdown:hover .cw-nav__dropdown,
.cw-nav__item--has-dropdown:focus-within .cw-nav__dropdown {
opacity: 1;
visibility: visible;
transform: translateY(0);
}
.cw-nav__dropdown a {
display: block;
font-size: var(--cw-text-sm);
color: var(--cw-text);
padding: 0.5rem 0.75rem;
border-radius: var(--cw-radius-sm);
}
.cw-nav__dropdown a:hover { background: var(--cw-primary-light); color: var(--cw-primary-dark); }
.cw-nav__dropdown--nested a { padding-left: 1.5rem; }
.cw-nav__dropdown-divider { height: 1px; background: var(--cw-border); margin: var(--cw-space-xs) 0; }
.cw-nav__dropdown-phone { color: var(--cw-primary); font-weight: var(--cw-weight-bold); }
.cw-header__phone {
font-family: var(--cw-font-heading);
font-weight: var(--cw-weight-bold);
color: var(--cw-primary-mid);
white-space: nowrap;
}
.cw-header__actions { display: flex; align-items: center; gap: var(--cw-space-md); }
/* Mobile toggle + drawer */
.cw-nav-toggle { display: none; flex-direction: column; gap: 5px; padding: var(--cw-space-xs); }
.cw-nav-toggle span { display: block; width: 26px; height: 2px; background: var(--cw-on-dark); transition: transform var(--cw-ease), opacity var(--cw-ease); }
.cw-drawer { display: none; }
@media (max-width: 980px) {
.cw-nav__menu { display: none; }
.cw-header__actions { display: none; }
.cw-nav-toggle { display: flex; margin-left: auto; }
.cw-drawer {
display: block;
position: fixed;
inset: 0 0 0 auto;
width: min(86vw, 380px);
background: var(--cw-navy);
padding: var(--cw-space-xl) var(--cw-space-lg);
transform: translateX(100%);
transition: transform var(--cw-ease-md);
z-index: var(--cw-z-modal);
overflow-y: auto;
}
.cw-drawer.is-open { transform: translateX(0); }
.cw-drawer__overlay {
display: none;
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.5);
z-index: var(--cw-z-overlay);
}
.cw-drawer__overlay.is-open { display: block; }
.cw-drawer a { display: block; color: var(--cw-on-dark); font-size: 1.0625rem; padding: var(--cw-space-sm) 0; border-bottom: 1px solid var(--cw-on-dark-border); }
.cw-drawer a:hover { color: var(--cw-primary-mid); }
.cw-drawer__phone {
margin-top: var(--cw-space-lg);
font-family: var(--cw-font-heading);
font-weight: var(--cw-weight-bold);
font-size: 1.5rem;
color: var(--cw-primary-mid);
text-align: center;
}
}
/* ═══════════════════════════════════════════
11. FOOTER
═══════════════════════════════════════════ */
.cw-footer { background: var(--cw-navy); color: var(--cw-on-dark-secondary); padding-block: var(--cw-space-2xl) var(--cw-space-lg); }
.cw-footer__grid {
max-width: var(--cw-container);
margin-inline: auto;
padding-inline: var(--cw-gutter);
display: grid;
grid-template-columns: 1.5fr 1fr 1fr 1.2fr;
gap: var(--cw-space-xl);
}
.cw-footer__brand img { max-height: 44px; width: auto; height: auto; margin-bottom: var(--cw-space-sm); }
.cw-footer__tagline { color: var(--cw-on-dark-secondary); font-size: var(--cw-text-sm); }
.cw-footer__areas { max-width: var(--cw-container); margin: var(--cw-space-lg) auto 0; padding-inline: var(--cw-gutter); }
.cw-footer__areas .cw-footer__heading a { color: inherit; }
.cw-footer__areas-list { list-style: none; margin: var(--cw-space-sm) 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--cw-space-2xs) var(--cw-space-md); }
.cw-footer__areas-list a { color: var(--cw-on-dark-secondary); font-size: var(--cw-text-sm); }
.cw-footer__areas-list a:hover { color: var(--cw-on-dark); }
@media (max-width: 760px) { .cw-footer__areas-list { grid-template-columns: repeat(2, 1fr); } }
.cw-footer__heading {
font-family: var(--cw-font-heading);
font-weight: var(--cw-weight-bold);
font-size: var(--cw-text-sm);
text-transform: uppercase;
letter-spacing: var(--cw-tracking-wide);
color: var(--cw-on-dark);
margin-bottom: var(--cw-space-md);
}
.cw-footer__links li { margin-bottom: var(--cw-space-xs); }
.cw-footer__links a { color: var(--cw-on-dark-secondary); font-size: var(--cw-text-sm); }
.cw-footer__links a:hover { color: var(--cw-primary-mid); }
.cw-footer a.cw-footer__contact-line { color: var(--cw-primary-mid); font-weight: var(--cw-weight-semibold); }
.cw-footer__bottom {
max-width: var(--cw-container);
margin: var(--cw-space-xl) auto 0;
padding: var(--cw-space-md) var(--cw-gutter) 0;
border-top: 1px solid var(--cw-on-dark-border);
display: flex;
justify-content: space-between;
flex-wrap: wrap;
gap: var(--cw-space-sm);
font-size: var(--cw-text-2xs);
color: var(--cw-on-dark-faint);
}
.cw-footer__bottom a { color: var(--cw-on-dark-muted); }
.cw-footer__bottom a:hover { color: var(--cw-on-dark-secondary); }
@media (max-width: 860px) {
.cw-footer__grid { grid-template-columns: 1fr 1fr; gap: var(--cw-space-lg); }
}
@media (max-width: 540px) {
.cw-footer__grid { grid-template-columns: 1fr; }
}
/* ═══════════════════════════════════════════
12. PAGE SECTIONS
═══════════════════════════════════════════ */
/* --- Hero --- */
.cw-hero { background: var(--cw-navy); color: var(--cw-on-dark); padding-block: var(--cw-space-2xl) var(--cw-space-section); }
.cw-hero__grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: var(--cw-space-2xl); align-items: center; }
.cw-hero__title { color: var(--cw-on-dark); font-size: clamp(2rem, 6vw, 3.75rem); line-height: 1.05; margin-bottom: var(--cw-space-md); }
.cw-hero .cw-eyebrow { color: var(--cw-on-dark-secondary); } /* legible eyebrow on navy (was low-contrast brand blue) */
.cw-hero__title .cw-accent { color: var(--cw-primary-mid); } /* hero headline accent */
.cw-hero__lead { color: var(--cw-on-dark-secondary); font-size: var(--cw-text-lead); max-width: 46ch; margin-bottom: var(--cw-space-lg); }
.cw-hero__actions { display: flex; flex-wrap: wrap; gap: var(--cw-space-sm); }
/* Hero stat card */
.cw-hero__card { background: var(--cw-on-dark-surface); border: 1px solid var(--cw-on-dark-border); border-radius: var(--cw-radius-lg); padding: var(--cw-space-lg); }
.cw-hero__card-note { font-size: var(--cw-text-xs); color: var(--cw-on-dark-muted); margin-top: var(--cw-space-md); }
@media (max-width: 860px) {
.cw-hero__grid { grid-template-columns: 1fr; gap: var(--cw-space-xl); }
}
/* --- Stats --- */
.cw-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--cw-space-lg); }
.cw-stats--2 { grid-template-columns: repeat(2, 1fr); }
.cw-stat__value { font-family: var(--cw-font-heading); font-weight: var(--cw-weight-extrabold); font-size: clamp(1.75rem, 4vw, 2.75rem); color: var(--cw-primary); line-height: 1; }
.cw-section--dark .cw-stat__value { color: var(--cw-primary-mid); }
.cw-hero__card .cw-stat__value { color: var(--cw-primary-mid); }
.cw-stat__label { font-size: var(--cw-text-xs); color: var(--cw-muted); margin-top: var(--cw-space-2xs); }
.cw-section--dark .cw-stat__label,
.cw-hero__card .cw-stat__label { color: var(--cw-on-dark-secondary); }
.cw-stat__desc { font-size: var(--cw-text-xs); color: var(--cw-muted); margin-top: var(--cw-space-2xs); }
@media (max-width: 720px) {
.cw-stats { grid-template-columns: repeat(2, 1fr); }
}
/* --- Split / approach --- */
.cw-split { display: grid; grid-template-columns: 1fr 1fr; gap: var(--cw-space-2xl); align-items: center; }
.cw-split__callout {
margin-top: var(--cw-space-lg);
padding: var(--cw-space-lg);
background: var(--cw-primary-light);
border-radius: var(--cw-radius-lg);
border-left: 4px solid var(--cw-primary);
}
.cw-split__callout strong { color: var(--cw-navy); font-size: var(--cw-text-lead); display: block; margin-bottom: var(--cw-space-2xs); }
@media (max-width: 860px) {
.cw-split { grid-template-columns: 1fr; gap: var(--cw-space-xl); }
}
/* --- Approach intro (cw4-style: content + stat aside) --- */
.cw-approach__inner { display: flex; gap: var(--cw-space-2xl); align-items: flex-start; }
.cw-approach__content { flex: 1 1 auto; min-width: 0; }
.cw-approach__content h2 { margin-bottom: var(--cw-space-md); }
.cw-approach__cta { margin-top: var(--cw-space-md); }
.cw-approach__aside { flex: 0 0 300px; display: flex; flex-direction: column; gap: var(--cw-space-sm); }
.cw-callout-card { background: var(--cw-surface-alt); border: 1px solid var(--cw-border); border-radius: var(--cw-radius-md); padding: var(--cw-space-lg); }
.cw-callout-card__value { font-family: var(--cw-font-heading); font-weight: var(--cw-weight-extrabold); font-size: 2.5rem; line-height: 1; color: var(--cw-navy); display: block; margin-bottom: var(--cw-space-xs); }
.cw-callout-card__label { display: block; color: var(--cw-text); font-weight: 600; margin-bottom: var(--cw-space-2xs); }
.cw-callout-card__body { display: block; color: var(--cw-muted); font-size: var(--cw-text-sm); line-height: 1.5; }
.cw-callout-card--dark { background: var(--cw-navy); border-color: transparent; }
.cw-callout-card--dark .cw-callout-card__value { color: var(--cw-on-dark); }
.cw-callout-card--dark .cw-callout-card__label { color: var(--cw-on-dark); }
.cw-callout-card--dark .cw-callout-card__body { color: var(--cw-on-dark-secondary); }
@media (max-width: 860px) {
.cw-approach__inner { flex-direction: column; }
.cw-approach__aside { flex-basis: auto; }
}
/* --- Services / card grids --- */
.cw-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--cw-space-lg); }
.cw-cards--2 { grid-template-columns: repeat(2, 1fr); }
.cw-cards--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--cw-space-md); }
@media (max-width: 960px) { .cw-cards, .cw-cards--4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .cw-cards, .cw-cards--2, .cw-cards--4 { grid-template-columns: 1fr; } }
/* --- Capability marquee --- */
.cw-marquee { background: var(--cw-navy); overflow: hidden; padding-block: var(--cw-space-sm); margin-top: 0; }
.cw-marquee__track { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--cw-space-xs) var(--cw-space-sm); align-items: center; }
.cw-marquee__item { color: var(--cw-on-dark-secondary); font-size: var(--cw-text-2xs); }
.cw-marquee__item::before { content: "•"; color: var(--cw-primary); margin-right: 6px; }
.cw-marquee__item strong { color: var(--cw-on-dark); font-weight: 600; }
@keyframes cw-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .cw-marquee__track { animation: none; } }
/* --- Team --- */
.cw-team { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--cw-space-lg); }
.cw-team-card { background: var(--cw-surface); border: 1px solid var(--cw-border); border-radius: var(--cw-radius-md); padding: var(--cw-space-lg); }
.cw-member__avatar {
width: 64px; height: 64px; border-radius: var(--cw-radius-pill);
display: flex; align-items: center; justify-content: center;
background: var(--cw-primary); color: var(--cw-white);
font-family: var(--cw-font-heading); font-weight: var(--cw-weight-bold); font-size: 1.25rem;
margin-bottom: var(--cw-space-md); overflow: hidden;
}
.cw-member__avatar img { width: 100%; height: 100%; object-fit: cover; }
.cw-member__name { font-size: var(--cw-text-card-h3); }
.cw-member__role { color: var(--cw-primary); font-weight: var(--cw-weight-semibold); font-size: var(--cw-text-sm); margin-bottom: var(--cw-space-xs); }
.cw-member__bio { color: var(--cw-muted); font-size: var(--cw-text-sm); }
.cw-section--dark .cw-member__role { color: var(--cw-primary-mid); }
.cw-section--dark .cw-member__bio { color: var(--cw-on-dark-secondary); }
.cw-section--dark .cw-member__name { color: var(--cw-on-dark); }
@media (max-width: 820px) { .cw-team { grid-template-columns: 1fr; } }
/* --- Reviews --- */
.cw-reviews { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--cw-space-md); }
.cw-reviews > .cw-card { border-radius: var(--cw-radius-md); }
.cw-review__stars { color: #F5A623; letter-spacing: 2px; margin-bottom: var(--cw-space-sm); }
.cw-review__text { color: var(--cw-text); font-size: var(--cw-text-sm); margin-bottom: var(--cw-space-md); }
.cw-review__author { font-weight: var(--cw-weight-bold); color: var(--cw-navy); }
.cw-review__context { font-size: var(--cw-text-xs); color: var(--cw-muted); }
@media (max-width: 960px) { .cw-reviews { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .cw-reviews { grid-template-columns: 1fr; } }
/* Leave-a-review — final blue CTA band */
.cw-rev-final { background: var(--cw-primary); padding: var(--cw-space-section) 0; text-align: center; }
.cw-rev-final h2 { color: var(--cw-on-dark); }
.cw-rev-final p { color: var(--cw-on-dark); margin-top: var(--cw-space-sm); max-width: 48ch; margin-inline: auto; }
.cw-rev-final .cw-hero__actions { margin-top: var(--cw-space-lg); }
/* --- Datacenter feature grid (dark) --- */
.cw-feature__title { font-size: var(--cw-text-lead); color: var(--cw-on-dark); margin-bottom: var(--cw-space-xs); }
.cw-feature__body { color: var(--cw-on-dark-secondary); font-size: var(--cw-text-sm); }
/* --- CTA band --- */
.cw-cta-band { background: var(--cw-navy); color: var(--cw-white); padding-block: var(--cw-space-2xl); }
.cw-cta-band__inner { display: flex; justify-content: space-between; align-items: center; gap: var(--cw-space-2xl); }
.cw-cta-band__text { text-align: left; }
@media (max-width: 760px) { .cw-cta-band__inner { flex-direction: column; align-items: flex-start; } }
.cw-cta-band h2 { color: var(--cw-white); margin-bottom: 0; }
.cw-cta-band .cw-eyebrow { color: rgba(255, 255, 255, 0.8); }
.cw-cta-band__actions { display: flex; flex-wrap: wrap; gap: var(--cw-space-sm); flex-shrink: 0; }
.cw-cta-band .cw-btn--primary { background: var(--cw-primary); color: var(--cw-white); border-color: var(--cw-primary); }
.cw-cta-band .cw-btn--primary:hover { background: var(--cw-primary-dark); border-color: var(--cw-primary-dark); }
/* --- FAQ (accordion) --- */
.cw-faq__item { border-bottom: 1px solid var(--cw-border); }
.cw-faq__q { font-family: var(--cw-font-heading); font-weight: var(--cw-weight-bold); font-size: 1.125rem; color: var(--cw-navy); padding: var(--cw-space-md) 0; cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: var(--cw-space-md); text-transform: none; }
.cw-faq__q::-webkit-details-marker { display: none; }
.cw-faq__q::after { content: "+"; color: var(--cw-primary); font-size: 1.5rem; line-height: 1; }
.cw-faq__item[open] .cw-faq__q::after { content: "–"; }
.cw-faq__a { color: var(--cw-muted); font-size: var(--cw-text-sm); padding-bottom: var(--cw-space-md); }
/* --- Timeline --- */
.cw-timeline { display: grid; gap: var(--cw-space-lg); }
.cw-timeline__item { display: grid; grid-template-columns: 160px 1fr; gap: var(--cw-space-lg); padding-bottom: var(--cw-space-lg); border-bottom: 1px solid var(--cw-border); }
.cw-timeline__year { font-family: var(--cw-font-heading); font-weight: var(--cw-weight-extrabold); text-transform: uppercase; color: var(--cw-primary); }
.cw-timeline__title { font-size: var(--cw-text-card-h3); margin-bottom: var(--cw-space-2xs); }
.cw-timeline__body { color: var(--cw-muted); font-size: var(--cw-text-sm); }
@media (max-width: 640px) { .cw-timeline__item { grid-template-columns: 1fr; gap: var(--cw-space-xs); } }
/* --- Values / numbered cards --- */
.cw-values { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--cw-space-lg); }
.cw-value__num { font-family: var(--cw-font-heading); font-weight: var(--cw-weight-extrabold); font-size: 1.5rem; color: var(--cw-primary-mid); margin-bottom: var(--cw-space-xs); }
.cw-value__title { font-size: var(--cw-text-card-h3); margin-bottom: var(--cw-space-xs); }
.cw-value__body { color: var(--cw-muted); font-size: var(--cw-text-sm); }
@media (max-width: 720px) { .cw-values { grid-template-columns: 1fr; } }
/* --- Steps (next steps / how-to) --- */
.cw-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--cw-space-lg); counter-reset: cw-step; }
.cw-step__num { font-family: var(--cw-font-heading); font-weight: var(--cw-weight-extrabold); font-size: 1.5rem; color: var(--cw-primary); }
.cw-step__title { font-size: var(--cw-text-card-h3); margin: var(--cw-space-xs) 0; }
.cw-step__body { color: var(--cw-muted); font-size: var(--cw-text-sm); }
@media (max-width: 820px) { .cw-steps { grid-template-columns: 1fr; } }
/* --- Emergency callout --- */
.cw-emergency-note { background: var(--cw-emergency-bg); border: 1px solid var(--cw-emergency); border-radius: var(--cw-radius-md); padding: var(--cw-space-md) var(--cw-space-lg); color: var(--cw-text); }
.cw-emergency-note strong { color: var(--cw-emergency); }
.cw-emergency-note a { color: var(--cw-emergency); font-weight: var(--cw-weight-bold); }
/* --- Service / area two-column layout with sidebar --- */
.cw-layout-sidebar { display: grid; grid-template-columns: 1fr 360px; gap: var(--cw-space-2xl); align-items: start; }
.cw-sidebar { position: sticky; top: 100px; display: grid; gap: var(--cw-space-lg); }
.cw-sidebar__card { background: var(--cw-surface); border: 1px solid var(--cw-border); border-radius: var(--cw-radius-lg); padding: var(--cw-space-lg); box-shadow: var(--cw-shadow-card); }
.cw-sidebar__call { background: var(--cw-navy); color: var(--cw-on-dark); text-align: center; }
.cw-sidebar__call .cw-sidebar__phone { font-family: var(--cw-font-heading); font-weight: var(--cw-weight-bold); font-size: 1.75rem; color: var(--cw-primary-mid); }
.cw-sidebar__related .cw-card__title { font-size: var(--cw-text-lead); margin-bottom: var(--cw-space-sm); }
.cw-sidebar__related-list { list-style: none; margin: 0; padding: 0; }
.cw-sidebar__related-list li + li { border-top: 1px solid var(--cw-border); }
.cw-sidebar__related-list a { display: block; padding: var(--cw-space-xs) 0; color: var(--cw-primary); font-weight: var(--cw-weight-semibold); font-size: var(--cw-text-sm); }
.cw-sidebar__related-list a:hover { color: var(--cw-primary-dark); }
@media (max-width: 980px) { .cw-layout-sidebar { grid-template-columns: 1fr; } .cw-sidebar { position: static; } }
/* --- Area link grid (auto-pulled cities) --- */
.cw-area-links { display: flex; flex-wrap: wrap; gap: var(--cw-space-xs); }
.cw-area-links a { font-size: var(--cw-text-sm); padding: 0.4rem 0.9rem; border: 1px solid var(--cw-primary); border-radius: var(--cw-radius-pill); color: var(--cw-navy); transition: background var(--cw-ease), color var(--cw-ease), border-color var(--cw-ease); }
.cw-area-links a:hover { background: var(--cw-primary); color: var(--cw-white); border-color: var(--cw-primary); }
.cw-section--dark .cw-area-links a { color: var(--cw-on-dark); border-color: rgba(255, 255, 255, 0.5); }
.cw-section--dark .cw-area-links a:hover { background: var(--cw-primary-mid); border-color: var(--cw-primary-mid); color: var(--cw-navy); }
/* --- Prose (privacy policy / blog) --- */
.cw-prose { max-width: var(--cw-container-sm); }
.cw-prose h2, .cw-prose h3 { margin-top: var(--cw-space-xl); margin-bottom: var(--cw-space-sm); }
.cw-prose p, .cw-prose ul { margin-bottom: var(--cw-space-md); }
.cw-prose ul { list-style: disc; padding-left: 1.25rem; }
.cw-prose li { margin-bottom: var(--cw-space-2xs); color: var(--cw-muted); }
.cw-prose a { color: var(--cw-primary); text-decoration: underline; }
/* Blog — listing post cards */
.cw-blog-main .wp-block-post-template { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--cw-space-lg); }
.cw-post-card--list { background: var(--cw-surface); border: 1px solid var(--cw-border); border-radius: var(--cw-radius-md); padding: var(--cw-space-lg); }
.cw-post-card-meta { display: flex; flex-wrap: wrap; gap: var(--cw-space-xs) var(--cw-space-sm); align-items: center; margin-bottom: var(--cw-space-sm); font-size: var(--cw-text-2xs); text-transform: uppercase; letter-spacing: var(--cw-tracking-wide); }
.cw-post-card-meta .wp-block-post-date { color: var(--cw-muted); }
.cw-post-card-meta .wp-block-post-terms a { color: var(--cw-primary); font-weight: var(--cw-weight-semibold); text-decoration: none; }
.cw-post-card--list .wp-block-post-title { font-size: var(--cw-text-card-h3); line-height: var(--cw-leading-snug); margin: 0 0 var(--cw-space-sm); }
.cw-post-card--list .wp-block-post-title a { color: var(--cw-navy); text-decoration: none; }
.cw-post-card--list .wp-block-post-title a:hover { color: var(--cw-primary); }
.cw-post-card--list .wp-block-post-excerpt { color: var(--cw-muted); font-size: var(--cw-text-sm); }
.cw-post-card--list .wp-block-post-excerpt__more-link { display: inline-block; margin-top: var(--cw-space-sm); color: var(--cw-primary); font-weight: var(--cw-weight-semibold); text-decoration: none; }
.cw-blog-main .wp-block-query-pagination { margin-top: var(--cw-space-xl); display: flex; gap: var(--cw-space-sm); flex-wrap: wrap; align-items: center; }
.cw-blog-main .wp-block-query-pagination a, .cw-blog-main .wp-block-query-pagination .page-numbers { color: var(--cw-primary); }
.cw-blog-main .wp-block-query-pagination .current { color: var(--cw-text); font-weight: var(--cw-weight-bold); }
/* Blog — sidebar form card */
.cw-sidebar-form { background: var(--cw-surface); border: 1px solid var(--cw-border); border-radius: var(--cw-radius-md); padding: var(--cw-space-lg); }
.cw-sidebar-form h3 { margin-bottom: var(--cw-space-md); }
/* Blog — single post hero meta */
.cw-post-hero__back { display: inline-block; margin-bottom: var(--cw-space-md); color: var(--cw-primary-mid); font-size: var(--cw-text-sm); font-weight: var(--cw-weight-semibold); text-decoration: none; }
.cw-post-hero .wp-block-post-terms { color: var(--cw-primary-mid); font-size: var(--cw-text-eyebrow); text-transform: uppercase; letter-spacing: var(--cw-tracking-eyebrow); font-weight: var(--cw-weight-bold); margin-bottom: var(--cw-space-sm); }
.cw-post-hero .wp-block-post-terms a { color: var(--cw-primary-mid); text-decoration: none; }
.cw-post-hero .wp-block-post-title { color: var(--cw-on-dark); font-size: clamp(2rem, 5vw, 3.25rem); line-height: 1.1; margin-bottom: var(--cw-space-md); }
.cw-post-hero__meta { color: var(--cw-on-dark-secondary); font-size: var(--cw-text-sm); }
.cw-post-hero__meta .wp-block-post-date { display: inline; color: var(--cw-on-dark-secondary); }
/* ═══════════════════════════════════════════
13. BLOCKS — wrappers for PHP-rendered custom blocks
Each block outputs a .cw-block wrapper; inner styling reuses the
section/component classes above so there is one source per component.
═══════════════════════════════════════════ */
.cw-block { /* shared block wrapper hook; spacing comes from .cw-section */ }
/* BLOCK: cw/error-404 — page-not-found (navy two-column: hero + helpful-links panel) */
.cw-404 { background: var(--cw-navy); min-height: calc(100vh - 91px); display: flex; align-items: center; padding: var(--cw-space-section) 0; }
.cw-404 .cw-container { width: 100%; }
.cw-404-inner { display: grid; grid-template-columns: 1fr; gap: var(--cw-space-2xl); }
@media (min-width: 768px) { .cw-404-inner { grid-template-columns: 1.5fr 1fr; align-items: center; gap: var(--cw-space-section); } }
.cw-404-hero { position: relative; padding-top: clamp(5rem, 14vw, 10rem); }
.cw-404-code { font-family: var(--cw-font-heading); font-size: clamp(6rem, 18vw, 12rem); font-weight: var(--cw-weight-extrabold); color: var(--cw-primary); line-height: 0.85; margin: 0 0 var(--cw-space-lg); opacity: 0.18; position: absolute; top: 0; left: 0; user-select: none; pointer-events: none; }
.cw-404-title { font-family: var(--cw-font-heading); font-size: clamp(2rem, 5vw, 3.5rem); font-weight: var(--cw-weight-extrabold); text-transform: uppercase; color: var(--cw-white); line-height: 1.05; margin-bottom: var(--cw-space-md); }
.cw-404-sub { font-size: 1.0625rem; color: var(--cw-on-dark-secondary); line-height: var(--cw-leading-relaxed); margin-bottom: var(--cw-space-xl); max-width: 480px; }
.cw-404-actions { display: flex; flex-wrap: wrap; gap: var(--cw-space-sm); align-items: center; }
.cw-404-links { background: var(--cw-on-dark-surface); border: 1px solid var(--cw-on-dark-border); border-radius: var(--cw-radius-md); padding: var(--cw-space-xl); }
.cw-404-links-label { font-size: var(--cw-text-eyebrow); font-weight: var(--cw-weight-bold); letter-spacing: var(--cw-tracking-eyebrow); text-transform: uppercase; color: var(--cw-on-dark-muted); margin-bottom: var(--cw-space-md); }
.cw-404-link-list { list-style: none; padding: 0; margin: 0 0 var(--cw-space-xl); display: flex; flex-direction: column; gap: 2px; }
.cw-404-link { display: flex; align-items: center; gap: 8px; padding: 10px 0; font-size: var(--cw-text-sm); font-weight: var(--cw-weight-medium); color: var(--cw-on-dark-secondary); text-decoration: none; border-bottom: 1px solid var(--cw-on-dark-border); transition: color var(--cw-ease); }
.cw-404-link-list li:last-child .cw-404-link { border-bottom: none; }
.cw-404-link:hover { color: var(--cw-primary-mid); }
.cw-404-link svg { color: var(--cw-primary); flex-shrink: 0; }
.cw-404-phone { border-top: 1px solid var(--cw-on-dark-border); padding-top: var(--cw-space-md); }
.cw-404-phone p { font-size: var(--cw-text-2xs); color: var(--cw-on-dark-muted); margin-bottom: 4px; }
.cw-404-phone-link { font-family: var(--cw-font-heading); font-size: 1.625rem; font-weight: var(--cw-weight-extrabold); color: var(--cw-primary-mid); text-decoration: none; transition: color var(--cw-ease); }
.cw-404-phone-link:hover { color: var(--cw-white); }
/* ═══════════════════════════════════════════
14. UTILITIES
═══════════════════════════════════════════ */
.cw-text-center { text-align: center; }
.cw-mt-sm { margin-top: var(--cw-space-sm); }
.cw-mt-md { margin-top: var(--cw-space-md); }
.cw-mt-lg { margin-top: var(--cw-space-lg); }
.cw-mb-lg { margin-bottom: var(--cw-space-lg); }
.cw-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.cw-skip-link { position: absolute; left: -9999px; top: 0; background: var(--cw-primary); color: var(--cw-white); padding: var(--cw-space-sm) var(--cw-space-md); z-index: var(--cw-z-modal); }
.cw-skip-link:focus { left: var(--cw-space-sm); top: var(--cw-space-sm); }
/* ═══════════════════════════════════════════
15. THIRD-PARTY OVERRIDES (Gravity Forms, Rank Math)
Scoped + documented. !important is permitted ONLY here, and ONLY where
GF's own enqueued CSS cannot otherwise be defeated.
═══════════════════════════════════════════ */
.gform_wrapper .gform_fields { display: grid; gap: var(--cw-space-md); }
.gform_wrapper .gfield_label {
font-family: var(--cw-font-body);
font-weight: var(--cw-weight-bold);
font-size: var(--cw-text-label);
text-transform: uppercase;
letter-spacing: var(--cw-tracking-label);
color: var(--cw-muted);
}
.gform_wrapper input[type="text"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="tel"],
.gform_wrapper textarea,
.gform_wrapper select {
width: 100%;
font-size: var(--cw-text-body);
background: var(--cw-white);
border: 1px solid var(--cw-border);
border-radius: var(--cw-radius-md);
padding: 0.7rem 0.9rem;
}
.gform_wrapper input:focus,
.gform_wrapper textarea:focus,
.gform_wrapper select:focus {
outline: none;
border-color: var(--cw-primary);
box-shadow: 0 0 0 3px var(--cw-primary-light);
}
/* GF ships an inline button gradient/colour that loses to our class
without a hard override; scoped to the GF button only. */
.gform_wrapper .gform_footer .gform_button {
background: var(--cw-primary) !important; /* defeats GF inline button theme */
color: var(--cw-white) !important; /* defeats GF inline button theme */
font-family: var(--cw-font-heading);
font-weight: var(--cw-weight-bold);
text-transform: uppercase;
letter-spacing: var(--cw-tracking-button);
border: none;
border-radius: var(--cw-radius-md);
padding: 0.78rem 1.6rem;
width: 100%;
}
.gform_wrapper .gform_footer .gform_button:hover { background: var(--cw-primary-dark) !important; /* hover parity with above override */ }
/* GF orbital theme footer is .gform-footer (hyphen) and lays out as a flex row;
empty wpautop siblings stretch the submit button into a tall sliver in
narrow sidebars. Force block flow + full-width button. */
.gform_wrapper .gform-footer { display: block; }
/* wpautop scatters bare
and
-wrapped hidden inputs through GF output,
adding phantom vertical space. GF lays out fields with .gfield divs and never
uses
, so collapsing these is safe; hidden inputs still POST when hidden. */
.gform_wrapper br { display: none; }
.gform_wrapper p:has(> input[type="hidden"]),
.gform_wrapper p:has(> br),
.gform_wrapper p:empty,
.gform_wrapper .gform-footer > p,
.gform_wrapper .gform_footer > p { display: none; }
/* wpautop also leaves stray
/
as siblings of .gform_wrapper, inside the
block that embeds the shortcode (the sidebar form card). Collapse those too. */
.cw-sidebar-form br,
.cw-sidebar-form p:empty,
.cw-sidebar-form p:has(> br) { display: none; }
.gform_wrapper .gform-footer .gform_button {
background: var(--cw-primary) !important; /* defeats GF inline button theme */
color: var(--cw-white) !important; /* defeats GF inline button theme */
font-family: var(--cw-font-heading);
font-weight: var(--cw-weight-bold);
text-transform: uppercase;
letter-spacing: var(--cw-tracking-button);
border: none;
border-radius: var(--cw-radius-md);
padding: 0.78rem 1.6rem;
width: 100% !important; /* beat orbital ID-level inline styles */
height: auto;
min-height: 0;
}
.gform_wrapper .gform-footer .gform_button:hover { background: var(--cw-primary-dark) !important; /* hover parity with above override */ }
.gform_required_legend { display: none; }
/* Blog — sidebar "Browse the blog" card (categories + blog link) */
.cw-sidebar-links h3 { margin-bottom: var(--cw-space-md); }
.cw-sidebar-links .wp-block-categories { list-style: none; margin: 0; padding: 0; }
.cw-sidebar-links .wp-block-categories li { margin: 0 0 var(--cw-space-sm); }
.cw-sidebar-links .wp-block-categories li:last-child { margin-bottom: 0; }
.cw-sidebar-links .wp-block-categories a { color: var(--cw-primary); text-decoration: none; font-weight: var(--cw-weight-semibold); }
.cw-sidebar-links .wp-block-categories a:hover { text-decoration: underline; }
.cw-sidebar-links__all { margin: var(--cw-space-md) 0 0; padding-top: var(--cw-space-md); border-top: 1px solid var(--cw-border); }
.cw-sidebar-links__all a { color: var(--cw-primary); font-weight: var(--cw-weight-bold); text-decoration: none; }
.cw-sidebar-links__all a:hover { text-decoration: underline; }