71 lines
2.3 KiB
CSS
71 lines
2.3 KiB
CSS
/* ═══════════════════════════════════════════════════════════ */
|
||
/* stylesheet.css – Structural framework */
|
||
/* Uses variables from globals.css (Single Source of Truth) */
|
||
/* Generated by website-prototype-generator */
|
||
/* ═══════════════════════════════════════════════════════════ */
|
||
|
||
@import "tailwindcss";
|
||
|
||
/* ── Base Resets ───────────────────────────────────── */
|
||
|
||
*, *::before, *::after {
|
||
box-sizing: border-box;
|
||
margin: 0;
|
||
padding: 0;
|
||
}
|
||
|
||
html {
|
||
scroll-behavior: smooth;
|
||
-webkit-font-smoothing: antialiased;
|
||
-moz-osx-font-smoothing: grayscale;
|
||
}
|
||
|
||
body {
|
||
font-family: var(--font-body);
|
||
font-weight: var(--font-body-weight);
|
||
color: var(--color-foreground);
|
||
background-color: var(--color-background);
|
||
line-height: var(--text-base-line-height);
|
||
font-size: var(--text-base);
|
||
}
|
||
|
||
/* ── Headings ─────────────────────────────────────── */
|
||
|
||
h1, h2, h3, h4, h5, h6 {
|
||
font-family: var(--font-heading);
|
||
font-weight: var(--font-heading-weight);
|
||
}
|
||
|
||
/* ── Links ───────────────────────────────────────── */
|
||
|
||
a {
|
||
color: var(--color-primary);
|
||
text-decoration: none;
|
||
}
|
||
|
||
a:hover {
|
||
text-decoration: underline;
|
||
}
|
||
|
||
/* ── Images ──────────────────────────────────────── */
|
||
|
||
img, video, svg {
|
||
display: block;
|
||
max-width: 100%;
|
||
height: auto;
|
||
}
|
||
|
||
/* ── Focus ───────────────────────────────────────── */
|
||
|
||
:focus-visible {
|
||
outline: 2px solid var(--color-primary);
|
||
outline-offset: 2px;
|
||
}
|
||
|
||
/* ── Selection ──────────────────────────────────── */
|
||
|
||
::selection {
|
||
background-color: var(--color-primary);
|
||
color: var(--color-background);
|
||
}
|