/* =========================================================
   base.css — CSS custom properties, reset, editorial typografia
   ========================================================= */

:root {
	/* Text */
	--c-ink:          #14110F;
	--c-ink-muted:    #6B6357;

	/* Dark sections */
	--c-bg:           #0F0D0C;
	--c-bg-alt:       #1A1613;
	--c-paper-muted:  #A29B90;

	/* Paper sections */
	--c-paper:        #F2ECE0;
	--c-paper-alt:    #E8E1D3;

	/* Hairlines */
	--c-line-dark:    #2A2521;
	--c-line-paper:   #D8CEBE;

	/* Accent — Cinnabar */
	--c-accent:       #C4442A;
	--c-accent-deep:  #9E3521;

	/* Functional */
	--c-success:      #4F7A3A;
	--c-error:        #A83838;

	/* Fonts */
	--f-display: 'Instrument Serif', Georgia, 'Times New Roman', serif;
	--f-body:    'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

	/* Type scale */
	--f-display-xl: clamp(3.5rem, 7vw, 5.5rem);
	--f-display-l:  clamp(2.4rem, 4vw, 3.5rem);
	--f-display-m:  clamp(1.8rem, 3vw, 2.4rem);
	--f-display-s:  1.5rem;
	--f-body-l:     1.125rem;
	--f-body:       1.0625rem;
	--f-body-s:     0.9375rem;
	--f-label:      0.75rem;

	/* Radius */
	--r-none: 0;
	--r-xs:   2px;
	--r-sm:   4px;

	/* Spacing */
	--space-section:   120px;
	--space-section-m: 72px;
	--space-block:     64px;
	--space-item:      40px;

	/* Container */
	--container: 1280px;
	--gutter:    48px;
	--gutter-m:  24px;

	/* Header height */
	--header-h:   72px;
	--banner-h:   40px;
}

/* ============ Reset ============ */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-behavior: smooth; }
/* Anchor scroll offset (fixed banner+header) */
[id] { scroll-margin-top: calc(var(--banner-h) + var(--header-h) + 24px); }
body { margin: 0; padding: 0; }
img, picture, svg, video { max-width: 100%; height: auto; display: block; }
button { font: inherit; cursor: pointer; background: none; border: none; padding: 0; color: inherit; }
a { color: inherit; text-decoration: none; }
ul, ol { margin: 0; padding: 0; list-style: none; }
figure, blockquote { margin: 0; }
hr { border: none; margin: 0; }
input, select, textarea { font: inherit; color: inherit; }

/* ============ Typografia ============ */
body {
	font-family: var(--f-body);
	font-size: var(--f-body);
	line-height: 1.65;
	color: var(--c-ink);
	background: var(--c-paper);
	font-feature-settings: "ss01", "kern";
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Pierwsza sekcja wyciąga się pod fixed banner+header — body bez padding */
.as-main > .as-section:first-child {
	padding-top: calc(var(--banner-h) + var(--header-h) + var(--space-section));
}
/* Hero zajmuje 100vh — mniejszy padding-top bo jest full-height */
.as-main > .as-hero:first-child {
	padding-top: calc(var(--banner-h) + var(--header-h) + 40px);
}

h1, h2, h3, h4 {
	font-family: var(--f-display);
	font-weight: 400;
	line-height: 1.05;
	margin: 0;
	letter-spacing: -0.01em;
}

h1 { font-size: var(--f-display-xl); }
h2 { font-size: var(--f-display-l); line-height: 1.08; }
h3 { font-size: var(--f-display-m); line-height: 1.1; }
h4 { font-size: var(--f-display-s); line-height: 1.2; }

p { margin: 0 0 1.2em 0; }
p:last-child { margin-bottom: 0; }

strong, b { font-weight: 600; }
em, i { font-style: italic; }

/* Polish punctuation comfort */
.as-hp { hanging-punctuation: first last; }

/* Tabular numerals */
.as-tabular, .as-num, [data-num] { font-variant-numeric: tabular-nums; }

/* Selection */
::selection { background: var(--c-accent); color: var(--c-paper); }

/* Focus-visible */
:focus-visible { outline: 2px solid var(--c-accent); outline-offset: 3px; }

/* Skip link */
.as-skip-link {
	position: absolute; left: -9999px; top: 0;
	background: var(--c-ink); color: var(--c-paper);
	padding: 12px 20px; z-index: 9999;
}
.as-skip-link:focus { left: 16px; top: 16px; }
