/* PhantomWebsite — main stylesheet.
Industrial-mature rebrand: navy + muted brass, warm grays, thin lines,
Heebo Hebrew type, clean line-icons. RTL, responsive.
Heebo is loaded via in each page's . */
:root {
/* ink / text */
--ink: #161A20;
--ink-soft: #39414E;
--ink-muted: #6B7480;
/* surfaces (warm, concrete-leaning) */
--surface: #FFFFFF;
--surface-2: #F5F5F2;
--surface-3: #EAE8E2;
--line: #DCDAD2;
/* brand navy */
--accent: #16304F;
--accent-2: #21436A;
--accent-deep: #0F2238;
/* brand blue — sampled from the PHANTOM logo (replaces the old gold accent).
Token names kept as --brass* to avoid touching every rule. */
--brass: #1670B8; /* primary accent / CTA / highlights on light */
--brass-light: #79B4E8; /* highlights on dark backgrounds (lightened for WCAG AA contrast on navy) */
--brass-dark: #0F5489; /* accent text weight on white (AA contrast) */
--steel: #586475;
--danger: #B91C1C;
--success: #059669;
/* focus ring — brand blue (a11y: visible focus for keyboard users) */
--focus-ring: 0 0 0 3px rgba(22,112,184,0.40);
/* shape */
--radius: 4px;
--radius-lg: 10px;
--shadow: 0 1px 2px rgba(16,24,40,.06), 0 6px 18px rgba(16,24,40,.05);
--shadow-lg: 0 12px 40px rgba(16,24,40,.12);
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
font-family: 'Heebo', 'Segoe UI', 'Arial Hebrew', 'Helvetica Neue', Arial, sans-serif;
background: var(--surface);
color: var(--ink);
font-size: 16px;
line-height: 1.7;
direction: rtl;
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility;
}
/* ── ICONS (line system) ── */
.svg-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.icon {
width: 1.25em; height: 1.25em;
display: inline-block; vertical-align: -0.18em;
fill: none; stroke: currentColor;
stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
}
/* ── FOCUS (a11y: visible keyboard focus on all interactive elements) ── */
a:focus-visible, button:focus-visible, select:focus-visible,
input:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
outline: 2px solid var(--brass);
outline-offset: 2px;
border-radius: var(--radius);
}
/* Inputs keep their soft ring instead of an offset outline */
.form-group input:focus-visible, .form-group select:focus-visible,
.form-group textarea:focus-visible { outline: none; }
/* ── SKIP LINK (a11y: keyboard users jump to main content) ── */
.skip-link {
position: absolute;
right: 1rem;
top: -60px;
z-index: 1000;
background: var(--accent);
color: #fff;
padding: 10px 18px;
border-radius: var(--radius);
font-weight: 600;
text-decoration: none;
transition: top 0.2s;
}
.skip-link:focus { top: 1rem; }
/* ── NAV ── */
/* Scoped to #main-nav so other