/* ========================================================= CherryLaw — base.css Wspólne dla całego motywu: zmienne marki, resety, typografia .display, .eyebrow, .container. Źródło 1:1 z Claude Design (index.html ). Brand: burgund #430812, gray #F2F2F2, green #CFE8A9, pink #F8D9E0, black #000. Type: Arial. ========================================================= */ :root{ --burgund:#430812; --burgund-ink:#2a0509; --burgund-soft:#5a1620; --gray:#F2F2F2; --gray-line:#E4E2E1; --green:#CFE8A9; --green-accent:#7fb43a; --pink:#F8D9E0; --pink-deep:#F2C2CF; --ink:#0a0a0a; --ink-2:#3d3a39; --ink-3:#6f6c6a; /* było #7a7775 — o 3% ciemniej, żeby mikro-podpisy 11px spełniły WCAG AA (4,5:1 na białym) */ --white:#ffffff; --max:1320px; --gutter:clamp(20px, 4vw, 56px); } *{box-sizing:border-box;margin:0;padding:0;} html{ scroll-behavior:smooth; overflow-x:hidden; max-width:100%; } body{ font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; color: var(--ink); background: var(--white); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; line-height:1.55; overflow-x:hidden; max-width:100%; position:relative; } /* Display type — Arial (heavy + tight) */ .display{ font-family: "Arial Black", Arial, sans-serif; font-weight: 900; letter-spacing: -0.035em; line-height: 0.96; text-wrap: balance; } .display em, .display .it{ font-family: Arial, sans-serif; font-weight: 400; font-style: italic; letter-spacing: -0.02em; } .eyebrow{ font-family: Arial, sans-serif; font-size: 11px; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; color: var(--burgund); display:inline-flex; align-items:center; gap:10px; } .eyebrow::before{ content:""; width:28px;height:1px;background:currentColor;display:inline-block; } .container{ max-width: var(--max); margin: 0 auto; padding: 0 var(--gutter); } a{color:inherit;text-decoration:none;} ::selection{background:var(--burgund);color:#fff;} /* Tekst tylko dla czytników ekranu i wyszukiwarek — niewidoczny, ale RENDEROWANY (bez display:none / visibility:hidden), więc wchodzi do innerText i do drzewa dostępności. Używane do doprecyzowania krótkich CTA typu „Read more". */ .cl-sr-only{ position:absolute; width:1px;height:1px; padding:0;margin:-1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0; } /* Dekoracyjny gradient sekcji kontakt nie może przechwytywać kliknięć (link „Meet the team"). */ .contact::before{ pointer-events: none; } /* Cookie banner (Complianz) — „View preferences" przeniesiony JS-em obok „Privacy Policy" i stylowany jako link (wszystkie ekrany), więc w przyciskach zostają Accept + Deny. */ #cmplz-cookiebanner-container .cmplz-links.cmplz-documents .cmplz-view-preferences{ background: transparent !important; border: none !important; box-shadow: none !important; height: auto !important; width: auto !important; padding: 0 !important; margin: 0 !important; color: var(--cmplz_hyperlink_color, #cfe8a9) !important; text-decoration: underline !important; font-size: 12px !important; font-weight: 500 !important; line-height: 1.4 !important; white-space: nowrap; cursor: pointer; } /* Mobile (≤768px): kompaktowy baner + Accept i Deny obok siebie (po 50%). */ @media (max-width: 768px){ #cmplz-cookiebanner-container .cmplz-cookiebanner{ font-size: 12px; } #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-title{ font-size: 14px; } #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn{ height: auto !important; padding: 8px 14px !important; font-size: 13px !important; line-height: 1.25 !important; } #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons{ flex-direction: row !important; gap: 8px !important; } }