/* ArCAd — arcad-pracowniainzynierska.pl
   Jeden plik ze stylami całej strony. */

@import url("https://fonts.googleapis.com/css2?family=Jost:wght@200;300;400;500;600&family=Manrope:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap");

:root{
  /* Papier i atrament */
  --white:#FFFFFF;
  --paper-1:#FAF9F7;
  --paper-2:#F2F0EC;
  --paper-3:#E7E4DE;
  --ink-900:#0A0A0A;
  --ink-800:#151515;
  --ink-700:#242424;
  --ink-600:#3D3D3D;
  --ink-500:#5C5C5C;
  --ink-400:#8A8A8A;
  --ink-300:#B5B5B5;
  --ink-200:#D8D6D2;
  --ink-100:#EAE8E4;

  /* Złoto — jedyny akcent */
  --gold-100:#FBF3DF;
  --gold-200:#F5E4BE;
  --gold-300:#EFCF8E;
  --gold-400:#EFCB7A;
  --gold-500:#C9A24A;
  --gold-600:#AC8837;
  --gold-700:#8A6D2B;

  /* Kolory statusów (dokumenty, nie dashboard) */
  --state-ok:#3F6B4F;
  --state-warn:#A8722A;
  --state-alert:#8C3A32;
  --state-info:#3A5568;

  /* Aliasy znaczeniowe */
  --bg-page:var(--paper-1);
  --bg-page-alt:var(--paper-2);
  --surface-card:var(--white);
  --surface-inverse:var(--ink-900);

  --text-heading:var(--ink-900);
  --text-body:var(--ink-700);
  --text-muted:var(--ink-500);
  --text-faint:var(--ink-400);
  --text-on-inverse:#F4F2EE;
  --text-on-inverse-muted:#A9A6A0;

  --border-hairline:var(--ink-200);
  --border-inverse:rgba(255,255,255,.18);
  --border-accent:var(--gold-500);

  --overlay-scrim:rgba(10,10,10,.62);
  --blur-glass:saturate(120%) blur(14px);

  /* Typografia */
  --font-display:"Jost","Futura","Century Gothic",sans-serif;
  --font-body:"Manrope","Helvetica Neue",Arial,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,monospace;

  --fs-3xs:11px; --fs-2xs:12px; --fs-xs:13px; --fs-sm:15px; --fs-md:17px;
  --fs-lg:21px; --fs-xl:27px; --fs-2xl:34px; --fs-3xl:44px; --fs-4xl:58px;

  --lh-tight:1.05; --lh-snug:1.2; --lh-normal:1.5; --lh-loose:1.65;
  --fw-thin:200; --fw-light:300; --fw-regular:400; --fw-medium:500; --fw-semibold:600;

  --tracking-wide:0.24em;
  --tracking-mid:0.12em;
  --tracking-tight:-0.01em;

  /* Odstępy — siatka 4px */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:24px;
  --space-6:32px; --space-7:48px; --space-8:64px; --space-9:96px;

  --gutter:24px;
  --section-y:96px;
  --container-max:1240px;
  --container-narrow:760px;

  --radius-1:2px;
  --radius-2:4px;
  --radius-pill:999px;

  /* Cienie — neutralne, ciasne */
  --shadow-2:0 2px 8px rgba(10,10,10,.06);
  --shadow-3:0 8px 24px rgba(10,10,10,.08);
  --shadow-4:0 24px 60px rgba(10,10,10,.12);
  --shadow-focus:0 0 0 2px var(--white),0 0 0 4px var(--gold-500);

  /* Ruch */
  --dur-fast:160ms;
  --dur-base:240ms;
  --ease-standard:cubic-bezier(.22,.61,.36,1);
  --transition-ui:var(--dur-fast) var(--ease-standard);
}

@media (prefers-reduced-motion:reduce){
  :root{ --dur-fast:0ms; --dur-base:0ms; }
  html{ scroll-behavior:auto; }
}

/* ---------- Reset i podstawy ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background:var(--bg-page);
  color:var(--text-body);
  font:400 var(--fs-md)/var(--lh-loose) var(--font-body);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
h1,h2,h3,h4{ color:var(--text-heading); margin:0; font-weight:var(--fw-light); font-family:var(--font-display); }
h1{ font-size:clamp(30px,6vw,var(--fs-3xl)); line-height:var(--lh-snug); letter-spacing:var(--tracking-tight); }
h2{ font-size:clamp(24px,4.4vw,var(--fs-2xl)); line-height:var(--lh-snug); }
h3{ font-size:var(--fs-lg); line-height:var(--lh-snug); font-weight:var(--fw-regular); }
p{ margin:0; }
ul{ margin:0; padding:0; }
a{ color:var(--text-heading); text-decoration:none; border-bottom:1px solid var(--border-accent); transition:color var(--transition-ui), border-color var(--transition-ui); }
a:hover{ color:var(--gold-600); border-bottom-color:var(--gold-600); }
:focus-visible{ outline:none; box-shadow:var(--shadow-focus); }
img{ max-width:100%; display:block; }
button{ font:inherit; }
::selection{ background:var(--gold-200); color:var(--ink-900); }
.container{ max-width:var(--container-max); margin:0 auto; padding:0 var(--space-5); }
.container--narrow{ max-width:calc(var(--container-narrow) + var(--space-5)*2); }
.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; }
.skip-link{ position:absolute; left:var(--space-4); top:-60px; background:var(--ink-900); color:var(--white); padding:12px 18px; border-radius:var(--radius-1); z-index:200; transition:top var(--transition-ui); }
.skip-link:focus{ top:var(--space-4); }

/* ---------- Ikony (Lucide, wpisane na stałe do pliku, bez CDN) ---------- */
.icon{ display:inline-block; flex:0 0 auto; vertical-align:middle; stroke:currentColor; }

/* ---------- Sekcje ---------- */
.section{ padding:var(--space-8) 0; }
.section--page{ background:var(--bg-page); color:var(--text-body); }
.section--alt{ background:var(--bg-page-alt); color:var(--text-body); }
.section--inverse{ background:var(--surface-inverse); color:var(--text-on-inverse); }
@media (min-width:960px){ .section{ padding:var(--section-y) 0; } }

.eyebrow{ display:flex; align-items:center; gap:14px; font:500 var(--fs-2xs)/1 var(--font-body); text-transform:uppercase; letter-spacing:var(--tracking-wide); color:var(--text-muted); }
.eyebrow::before{ content:""; width:28px; height:1px; background:var(--gold-500); flex:0 0 auto; }
.eyebrow--onDark{ color:var(--text-on-inverse-muted); }
.eyebrow--noRule::before{ content:none; }

.rule{ height:1px; width:100%; background:var(--border-hairline); border:0; margin:0; }
.rule--inverse{ background:var(--border-inverse); }

/* ---------- Nagłówek ---------- */
.site-header{
  position:sticky; top:0; z-index:40;
  background:rgba(255,255,255,.86);
  -webkit-backdrop-filter:var(--blur-glass);
  backdrop-filter:var(--blur-glass);
  border-bottom:1px solid var(--border-hairline);
}
.site-header__bar{ height:68px; display:flex; align-items:center; gap:var(--space-4); }
.site-header__logo{ flex:0 0 auto; display:flex; align-items:center; border-bottom:none; }
.site-header__logo img{ height:22px; width:auto; }
.site-header__nav{ display:none; margin-left:auto; flex-wrap:nowrap; gap:var(--space-5); }
.site-header__nav a{
  font:600 var(--fs-3xs)/1 var(--font-body); text-transform:uppercase; letter-spacing:var(--tracking-wide);
  color:var(--text-muted); border-bottom:1px solid transparent; padding-bottom:4px; white-space:nowrap;
}
.site-header__nav a:hover{ color:var(--ink-900); }
.site-header__nav a[aria-current="page"]{ color:var(--ink-900); border-bottom-color:var(--gold-500); }
.site-header__phone{ display:none; margin-left:auto; font:400 var(--fs-xs)/1 var(--font-mono); color:var(--ink-700); white-space:nowrap; }
button.site-header__cta{ display:none; flex:0 0 auto; }
.site-header__burger{ flex:0 0 auto; display:inline-flex; margin-left:auto; }

@media (min-width:900px){
  .site-header__nav{ display:flex; }
  button.site-header__burger{ display:none; }
  button.site-header__cta{ display:inline-flex; margin-left:0; }
}
.mobile-nav__cta{ margin-top:var(--space-3); }
@media (min-width:1080px){
  .site-header__phone{ display:block; margin-left:var(--space-5); }
}
@media (min-width:600px){ .site-header__bar{ height:76px; } .site-header__logo img{ height:26px; } }

.mobile-nav{ display:none; flex-direction:column; gap:2px; padding:var(--space-2) 0 var(--space-5); border-top:1px solid var(--border-hairline); }
.mobile-nav.is-open{ display:flex; }
.mobile-nav a{
  padding:14px 4px; font:600 var(--fs-xs)/1 var(--font-body); text-transform:uppercase; letter-spacing:var(--tracking-wide);
  color:var(--text-muted); border-bottom:1px solid var(--border-hairline);
}
.mobile-nav a[aria-current="page"]{ color:var(--ink-900); }
.mobile-nav__phone{ padding:14px 4px 0; font:400 var(--fs-sm)/1 var(--font-mono); color:var(--ink-700); }
@media (min-width:900px){ .mobile-nav{ display:none!important; } }

/* ---------- Przyciski ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font:600 var(--fs-2xs)/1 var(--font-body); text-transform:uppercase; letter-spacing:var(--tracking-wide);
  border-radius:var(--radius-1); border:1px solid transparent; cursor:pointer; text-decoration:none;
  padding:14px 24px; min-height:46px;
  transition:background var(--transition-ui), color var(--transition-ui), border-color var(--transition-ui), opacity var(--transition-ui);
}
.btn:active{ transform:translateY(1px); }
.btn--sm{ font-size:var(--fs-3xs); padding:10px 16px; min-height:40px; }
.btn--lg{ font-size:var(--fs-xs); padding:17px 34px; min-height:52px; }
.btn--full{ width:100%; }
.btn[disabled]{ opacity:.38; pointer-events:none; }

.btn--primary{ background:var(--ink-900); color:var(--text-on-inverse); border-color:var(--ink-900); }
.btn--primary:hover{ background:var(--ink-700); border-color:var(--ink-700); }
.btn--gold{ background:var(--gold-400); color:var(--ink-900); border-color:var(--gold-400); }
.btn--gold:hover{ background:var(--gold-500); border-color:var(--gold-500); }
.btn--outline{ background:transparent; color:var(--ink-900); border-color:var(--ink-900); }
.btn--outline:hover{ background:var(--ink-900); color:var(--text-on-inverse); }
.btn--quiet{ background:transparent; color:var(--ink-900); border-color:var(--border-hairline); }
.btn--quiet:hover{ border-color:var(--gold-500); color:var(--gold-700); }
.btn--ghost{ background:transparent; color:var(--ink-900); border-color:transparent; padding-left:0; padding-right:0; }
.btn--ghost:hover{ color:var(--gold-700); }
.btn--inverse{ background:var(--white); color:var(--ink-900); border-color:var(--white); }
.btn--inverse:hover{ background:var(--gold-400); border-color:var(--gold-400); }
.btn--inverse-outline{ background:transparent; color:var(--text-on-inverse); border-color:var(--border-inverse); }
.btn--inverse-outline:hover{ border-color:var(--gold-400); color:var(--gold-400); }

.icon-btn{
  width:44px; height:44px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:var(--radius-1); cursor:pointer; background:transparent; color:var(--ink-900);
  border:1px solid var(--border-hairline); transition:all var(--transition-ui);
}
.icon-btn:hover{ border-color:var(--gold-500); color:var(--gold-700); }

/* ---------- Hero ---------- */
.hero{ background:var(--ink-900); color:var(--text-on-inverse); position:relative; overflow:hidden; }
.hero::before{
  content:""; position:absolute; inset:0; opacity:.18;
  background-image:linear-gradient(rgba(255,255,255,.16) 1px,transparent 1px), linear-gradient(90deg,rgba(255,255,255,.16) 1px,transparent 1px);
  background-size:48px 48px;
}
.hero__inner{ position:relative; padding:var(--space-8) 0; display:flex; flex-direction:column; gap:var(--space-7); }
.hero__title{ font-weight:var(--fw-thin); font-size:clamp(34px,8vw,var(--fs-4xl)); line-height:var(--lh-tight); letter-spacing:var(--tracking-tight); color:var(--text-on-inverse); max-width:780px; }
.hero__title em{ font-style:normal; color:var(--gold-400); }
.hero__lead{ font:300 var(--fs-lg)/var(--lh-normal) var(--font-body); color:var(--text-on-inverse-muted); max-width:520px; margin-top:var(--space-5); }
.hero__actions{ display:flex; flex-wrap:wrap; gap:var(--space-3); margin-top:var(--space-5); }
.hero__stats{ display:flex; flex-wrap:wrap; gap:var(--space-6) var(--space-7); padding-top:var(--space-6); border-top:1px solid var(--border-inverse); }
@media (min-width:960px){
  .hero__inner{ flex-direction:row; align-items:end; justify-content:space-between; padding:var(--space-9) 0; gap:var(--space-8); }
  .hero__main{ flex:1.25; }
  .hero__stats{ flex:.75; flex-direction:column; border-top:none; border-left:1px solid var(--border-inverse); padding:0 0 0 var(--space-6); }
}

.stat{ display:flex; flex-direction:column; gap:8px; }
.stat__value{ font-family:var(--font-display); font-weight:var(--fw-thin); font-size:var(--fs-3xl); line-height:var(--lh-tight); color:var(--text-heading); }
.stat--onDark .stat__value{ color:var(--text-on-inverse); }
.stat__unit{ font-size:var(--fs-lg); color:var(--gold-500); margin-left:6px; }
.stat__label{ font:600 var(--fs-3xs)/1 var(--font-body); text-transform:uppercase; letter-spacing:var(--tracking-wide); color:var(--text-muted); }
.stat--onDark .stat__label{ color:var(--text-on-inverse-muted); }

/* ---------- Zakres usług — pozioma lista ---------- */
.scroll-row{ display:grid; grid-auto-flow:column; grid-auto-columns:minmax(240px,1fr); gap:var(--space-4); overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:var(--space-4); margin-top:var(--space-6); -webkit-overflow-scrolling:touch; }
.scroll-row > *{ scroll-snap-align:start; }
.scroll-hint{ display:flex; align-items:center; gap:var(--space-4); margin-top:8px; }
.scroll-hint::before{ content:""; height:1px; flex:1; background:var(--border-hairline); }
.scroll-hint span{ font:600 var(--fs-3xs)/1 var(--font-body); text-transform:uppercase; letter-spacing:var(--tracking-wide); color:var(--text-faint); }

.service-card{
  display:flex; flex-direction:column; gap:var(--space-4); padding:var(--space-6);
  background:var(--surface-card); border:1px solid var(--border-hairline); border-radius:var(--radius-2);
  text-decoration:none; color:inherit; transition:border-color var(--transition-ui), transform var(--dur-base) var(--ease-standard);
}
.service-card:hover{ border-color:var(--gold-500); transform:translateY(-2px); }
.service-card__top{ display:flex; align-items:center; justify-content:space-between; }
.service-card__top .icon{ width:26px; height:26px; color:var(--ink-900); }
.service-card:hover .icon{ color:var(--gold-600); }
.service-card__index{ font:400 var(--fs-2xs)/1 var(--font-mono); color:var(--text-faint); }
.service-card h3{ font-size:var(--fs-lg); }
.service-card p{ font-size:var(--fs-sm); color:var(--text-muted); }

/* ---------- Jak pracujemy ---------- */
.process{ display:flex; flex-direction:column; }
.process-step{ display:grid; grid-template-columns:44px 1fr; gap:var(--space-4); }
.process-step__rail{ display:flex; flex-direction:column; align-items:center; gap:10px; }
.process-step__num{ width:40px; height:40px; display:grid; place-items:center; border:1px solid var(--gold-500); color:var(--gold-700); font:400 var(--fs-2xs)/1 var(--font-mono); border-radius:var(--radius-1); flex:0 0 auto; }
.process-step__line{ width:1px; flex:1; background:var(--border-hairline); min-height:24px; }
.process-step__body{ padding-bottom:var(--space-6); display:flex; flex-direction:column; gap:8px; }
.process-step:last-child .process-step__body{ padding-bottom:0; }
.process-step h3{ font:400 var(--fs-md)/var(--lh-snug) var(--font-display); margin:0; letter-spacing:var(--tracking-mid); text-transform:uppercase; }
.process-step p{ font-size:var(--fs-sm); color:var(--text-muted); max-width:560px; }

/* ---------- Media / zdjęcia ---------- */
.media-frame{ margin:0; display:flex; flex-direction:column; gap:12px; }
.media-frame__box{ aspect-ratio:4/3; border:1px solid var(--border-hairline); background:var(--paper-2); overflow:hidden; border-radius:var(--radius-2); }
.media-frame__box img{ width:100%; height:100%; object-fit:cover; }
.media-frame figcaption{ font-size:var(--fs-2xs); color:var(--text-muted); }

/* ---------- Karty realizacji ---------- */
.project-grid{ display:grid; grid-template-columns:1fr; gap:var(--space-5); }
@media (min-width:720px){ .project-grid{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:960px){ .project-grid{ grid-template-columns:repeat(3,1fr); gap:var(--space-6); } }

.project-card{ display:flex; flex-direction:column; gap:var(--space-4); text-decoration:none; color:inherit; }
.project-card__media{ position:relative; overflow:hidden; border-radius:var(--radius-2); }
.project-card__media img{ filter:grayscale(100%); transition:filter var(--dur-base) var(--ease-standard); }
.project-card:hover .project-card__media img{ filter:grayscale(0%); }
.project-card__badge{ position:absolute; top:12px; left:12px; }
.project-card__head{ display:flex; align-items:baseline; gap:var(--space-3); }
.project-card__head h3{ font:400 var(--fs-md)/var(--lh-snug) var(--font-display); text-transform:uppercase; letter-spacing:var(--tracking-mid); }
.project-card__head .icon{ margin-left:auto; width:16px; height:16px; color:var(--ink-400); transition:color var(--transition-ui); }
.project-card:hover .project-card__head .icon{ color:var(--gold-600); }
.project-card__meta{ display:flex; gap:var(--space-4); font:400 var(--fs-2xs)/1 var(--font-mono); color:var(--text-muted); }

/* ---------- Odznaki / tagi ---------- */
.badge{ display:inline-flex; align-items:center; gap:6px; font:500 var(--fs-3xs)/1 var(--font-body); text-transform:uppercase; letter-spacing:var(--tracking-mid); padding:5px 10px; border-radius:var(--radius-1); }
.badge--neutral{ background:var(--paper-2); color:var(--ink-700); border:1px solid var(--border-hairline); }
.badge--gold{ background:var(--gold-100); color:var(--gold-700); border:1px solid var(--gold-300); }
.badge--ink{ background:var(--ink-900); color:var(--text-on-inverse); border:1px solid var(--ink-900); }

.tag{ display:inline-flex; align-items:center; gap:8px; font-size:var(--fs-xs); padding:9px 14px; min-height:40px; border-radius:var(--radius-1); border:1px solid var(--border-hairline); background:transparent; color:var(--ink-600); cursor:pointer; transition:all var(--transition-ui); }
.tag[aria-pressed="true"]{ border-color:var(--ink-900); background:var(--ink-900); color:var(--text-on-inverse); }

/* ---------- Cytaty ---------- */
.quote-grid{ display:grid; grid-template-columns:1fr; gap:var(--space-7); }
@media (min-width:720px){ .quote-grid{ grid-template-columns:1fr 1fr; gap:var(--space-9); } }
.quote{ margin:0; display:flex; flex-direction:column; gap:var(--space-5); }
.quote::before{ content:""; width:40px; height:1px; background:var(--gold-500); display:block; }
.quote p{ font:300 var(--fs-xl)/var(--lh-snug) var(--font-display); color:var(--text-on-inverse); }
.quote footer{ display:flex; flex-direction:column; gap:4px; }
.quote cite{ font:500 var(--fs-2xs)/1 var(--font-body); font-style:normal; text-transform:uppercase; letter-spacing:var(--tracking-mid); color:var(--text-on-inverse); }
.quote .role{ font-size:var(--fs-2xs); color:var(--text-on-inverse-muted); }

/* ---------- Pasek CTA ---------- */
.cta-band{ background:var(--surface-inverse); color:var(--text-on-inverse); padding:var(--space-7) var(--space-6); border-radius:var(--radius-2); display:flex; flex-direction:column; gap:var(--space-6); }
.cta-band h2{ color:var(--text-on-inverse); max-width:620px; }
.cta-band p{ font-size:var(--fs-sm); color:var(--text-on-inverse-muted); max-width:540px; margin-top:var(--space-3); }
.cta-band__actions{ display:flex; flex-wrap:wrap; gap:var(--space-3); }
@media (min-width:960px){ .cta-band{ flex-direction:row; align-items:center; justify-content:space-between; padding:var(--space-8) var(--space-7); } }

/* ---------- Karty ogólne ---------- */
.card{ border-radius:var(--radius-2); padding:var(--space-6); background:var(--surface-card); border:1px solid var(--border-hairline); }
.card--sunken{ background:var(--paper-2); border-color:transparent; }

/* ---------- Formularze ---------- */
.field{ display:flex; flex-direction:column; gap:8px; }
.field label{ font:500 var(--fs-3xs)/1 var(--font-body); text-transform:uppercase; letter-spacing:var(--tracking-mid); color:var(--text-muted); }
.field .required{ color:var(--gold-600); }
.field .hint{ font-size:var(--fs-2xs); color:var(--text-faint); }
.input-shell{ position:relative; display:block; }
.input-shell .icon{ position:absolute; left:14px; top:50%; transform:translateY(-50%); color:var(--text-faint); width:16px; height:16px; pointer-events:none; }
.input, .select, .textarea{
  width:100%; font:400 var(--fs-sm)/var(--lh-normal) var(--font-body); color:var(--text-body); background:var(--white);
  border:1px solid var(--border-hairline); border-radius:var(--radius-1); padding:14px; min-height:46px; outline:none;
  transition:border-color var(--transition-ui), box-shadow var(--transition-ui);
}
.input-shell .input{ padding-left:42px; }
.textarea{ resize:vertical; min-height:110px; }
.input:focus, .select:focus, .textarea:focus{ border-color:var(--gold-500); box-shadow:inset 0 0 0 1px var(--gold-500); }
.select-shell{ position:relative; }
.select{ appearance:none; -webkit-appearance:none; padding-right:40px; cursor:pointer; }
.select-shell .icon{ position:absolute; right:14px; top:50%; transform:translateY(-50%); color:var(--ink-500); width:16px; height:16px; pointer-events:none; }

.checkbox{ display:inline-flex; align-items:flex-start; gap:12px; cursor:pointer; }
.checkbox input{ position:absolute; opacity:0; width:0; height:0; }
.checkbox__box{ width:18px; height:18px; flex:0 0 auto; margin-top:2px; display:grid; place-items:center; border:1px solid var(--ink-300); background:var(--white); color:var(--gold-400); border-radius:var(--radius-1); transition:all var(--transition-ui); }
.checkbox__box .icon{ width:12px; height:12px; display:none; }
.checkbox input:checked + .checkbox__box{ border-color:var(--ink-900); background:var(--ink-900); }
.checkbox input:checked + .checkbox__box .icon{ display:block; }
.checkbox span:last-child{ font-size:var(--fs-sm); color:var(--text-body); }

/* ---------- Powiadomienia ---------- */
.notice{ display:flex; gap:14px; align-items:flex-start; padding:16px 18px; border-radius:var(--radius-2); }
.notice .icon{ width:18px; height:18px; margin-top:2px; flex:0 0 auto; }
.notice__body{ display:flex; flex-direction:column; gap:4px; }
.notice strong{ font:600 var(--fs-sm)/var(--lh-normal) var(--font-body); color:var(--ink-900); }
.notice span{ font-size:var(--fs-xs); color:var(--text-body); }
.notice--info{ background:rgba(58,85,104,.06); border:1px solid rgba(58,85,104,.28); color:var(--state-info); }
.notice--ok{ background:rgba(63,107,79,.06); border:1px solid rgba(63,107,79,.28); color:var(--state-ok); }

/* ---------- Okno modalne wyceny ---------- */
dialog.modal{ width:min(560px,100%); border:1px solid var(--border-hairline); border-radius:var(--radius-2); box-shadow:var(--shadow-4); padding:0; background:var(--surface-card); color:var(--text-body); }
dialog.modal::backdrop{ background:var(--overlay-scrim); backdrop-filter:blur(3px); }
.modal__head{ display:flex; align-items:flex-start; gap:var(--space-4); padding:26px 28px 20px; border-bottom:1px solid var(--border-hairline); }
.modal__head h3{ font-size:var(--fs-lg); }
.modal__close{ all:unset; cursor:pointer; margin-left:auto; color:var(--ink-500); width:18px; height:18px; }
.modal__body{ padding:24px 28px; font-size:var(--fs-sm); display:flex; flex-direction:column; gap:var(--space-4); }
.modal__foot{ display:flex; justify-content:flex-end; gap:var(--space-3); padding:18px 28px 24px; border-top:1px solid var(--border-hairline); flex-wrap:wrap; }

/* ---------- Toast (potwierdzenie wysłania) ---------- */
.toast-wrap{ position:fixed; left:var(--space-4); right:var(--space-4); bottom:var(--space-5); display:flex; justify-content:center; z-index:120; pointer-events:none; }
.toast-wrap[hidden]{ display:none; }
.toast{ display:inline-flex; align-items:center; gap:16px; padding:14px 18px; border-radius:var(--radius-2); box-shadow:var(--shadow-3); background:var(--ink-900); color:var(--text-on-inverse); font-size:var(--fs-xs); pointer-events:auto; max-width:100%; }
.toast button{ all:unset; cursor:pointer; opacity:.7; width:14px; height:14px; }

/* ---------- Stopka ---------- */
.site-footer{ background:var(--surface-inverse); color:var(--text-on-inverse); padding:var(--space-8) 0 var(--space-6); }
.site-footer__grid{ display:grid; grid-template-columns:1fr; gap:var(--space-7); }
.site-footer__brand{ display:flex; flex-direction:column; gap:var(--space-4); }
.site-footer__brand img{ height:44px; width:auto; }
.site-footer__contact{ display:flex; flex-direction:column; gap:8px; font-size:var(--fs-xs); color:var(--text-on-inverse-muted); }
.site-footer__contact li{ list-style:none; display:flex; gap:10px; align-items:center; }
.site-footer__contact .icon{ width:14px; height:14px; flex:0 0 auto; }
.site-footer__col{ display:flex; flex-direction:column; gap:14px; }
.site-footer__col span{ font:600 var(--fs-3xs)/1 var(--font-body); text-transform:uppercase; letter-spacing:var(--tracking-wide); color:var(--gold-400); }
.site-footer__col a{ font-size:var(--fs-xs); color:var(--text-on-inverse-muted); border-bottom:none; }
.site-footer__col a:hover{ color:var(--gold-400); }
.site-footer__note{ font:400 var(--fs-3xs)/1 var(--font-body); color:var(--text-on-inverse-muted); letter-spacing:var(--tracking-mid); text-transform:uppercase; margin-top:var(--space-7); padding-top:var(--space-4); border-top:1px solid var(--border-inverse); display:block; }
@media (min-width:600px){ .site-footer__grid{ grid-template-columns:1.4fr 1fr 1fr; } }
@media (min-width:960px){ .site-footer__grid{ grid-template-columns:1.4fr 1fr 1fr 1fr; } }

/* ---------- Okruszki (breadcrumbs) ---------- */
.breadcrumbs{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.breadcrumbs span{ font:500 var(--fs-3xs)/1 var(--font-body); text-transform:uppercase; letter-spacing:var(--tracking-mid); color:var(--text-muted); }
.breadcrumbs span[aria-current="page"]{ color:var(--ink-900); }
.breadcrumbs .sep{ color:var(--gold-500); font-size:var(--fs-2xs); }

/* ---------- Zakładki usług — bez JS, na inputach radio ----------
   Budowa strony: 8 niewidocznych "przełączników" (input type=radio)
   siedzi na samej górze sekcji .tabs-wrap. Dzięki temu jedna reguła CSS
   ("ten przełącznik jest zaznaczony -> pokaż jego panel gdzieś dalej w tej
   samej sekcji") wystarcza, żeby zakładki działały bez ani jednej linijki
   JavaScriptu. */
.tabs-wrap{ position:relative; display:block; }
.tab-radio{ position:absolute; opacity:0; width:0; height:0; pointer-events:none; }
.tabs-row{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.tabs{ display:flex; gap:var(--space-6); border-bottom:1px solid var(--border-hairline); min-width:760px; }
.tabs label{ padding:0 0 14px; margin-bottom:-1px; font:600 var(--fs-2xs)/1 var(--font-body); text-transform:uppercase; letter-spacing:var(--tracking-mid); color:var(--text-muted); border-bottom:2px solid transparent; cursor:pointer; white-space:nowrap; transition:all var(--transition-ui); display:inline-block; }
.tab-panel{ display:none; }
#tab-projekt:checked ~ .section .tabs label[for="tab-projekt"],
#tab-drogowe:checked ~ .section .tabs label[for="tab-drogowe"],
#tab-krajobraz:checked ~ .section .tabs label[for="tab-krajobraz"],
#tab-energetyka:checked ~ .section .tabs label[for="tab-energetyka"],
#tab-kierowanie:checked ~ .section .tabs label[for="tab-kierowanie"],
#tab-nadzor:checked ~ .section .tabs label[for="tab-nadzor"],
#tab-koordynacja:checked ~ .section .tabs label[for="tab-koordynacja"],
#tab-przeglady:checked ~ .section .tabs label[for="tab-przeglady"]{ color:var(--ink-900); border-bottom-color:var(--gold-500); }
#tab-projekt:checked ~ .section .tab-panels #panel-projekt,
#tab-drogowe:checked ~ .section .tab-panels #panel-drogowe,
#tab-krajobraz:checked ~ .section .tab-panels #panel-krajobraz,
#tab-energetyka:checked ~ .section .tab-panels #panel-energetyka,
#tab-kierowanie:checked ~ .section .tab-panels #panel-kierowanie,
#tab-nadzor:checked ~ .section .tab-panels #panel-nadzor,
#tab-koordynacja:checked ~ .section .tab-panels #panel-koordynacja,
#tab-przeglady:checked ~ .section .tab-panels #panel-przeglady{ display:block; }

.service-detail{ display:flex; flex-direction:column; gap:var(--space-8); }
.service-detail__text{ display:flex; flex-direction:column; gap:var(--space-5); }
.service-detail__list{ display:flex; flex-direction:column; gap:var(--space-3); }
.service-detail__list li{ list-style:none; display:flex; gap:14px; align-items:center; font-size:var(--fs-sm); }
.service-detail__list .icon{ color:var(--gold-600); width:16px; height:16px; flex:0 0 auto; }
.service-detail__side{ display:flex; flex-direction:column; gap:var(--space-4); }
.price-card__top{ display:flex; justify-content:space-between; align-items:center; }
.price-card__value{ font-size:var(--fs-2xl); margin-top:var(--space-4); font-family:var(--font-display); font-weight:var(--fw-light); }
.price-card__row{ display:flex; justify-content:space-between; font:400 var(--fs-2xs)/1 var(--font-mono); color:var(--text-muted); margin:var(--space-4) 0; }
.price-card__row b{ color:var(--ink-900); font-weight:400; }
@media (min-width:960px){
  .service-detail{ flex-direction:row; gap:var(--space-9); }
  .service-detail__text{ flex:1.15; }
  .service-detail__side{ flex:.85; }
}

/* ---------- Realizacje: filtry ---------- */
.filters-bar{ display:flex; align-items:center; gap:var(--space-3); flex-wrap:wrap; }
.switch{ display:inline-flex; align-items:center; gap:12px; cursor:pointer; margin-left:auto; }
.switch input{ position:absolute; opacity:0; width:0; height:0; }
.switch__track{ width:40px; height:22px; flex:0 0 auto; padding:2px; border-radius:var(--radius-pill); background:var(--ink-200); display:flex; transition:background var(--transition-ui); }
.switch__thumb{ width:18px; height:18px; border-radius:var(--radius-pill); background:var(--white); transition:all var(--transition-ui); }
.switch input:checked ~ .switch__track{ background:var(--ink-900); justify-content:flex-end; }
.switch input:checked ~ .switch__track .switch__thumb{ background:var(--gold-400); }
.switch span:last-child{ font-size:var(--fs-sm); color:var(--text-body); }
.project[hidden]{ display:none; }

/* ---------- Grid ogólny 2 kolumny ---------- */
.split{ display:flex; flex-direction:column; gap:var(--space-7); }
@media (min-width:960px){ .split{ flex-direction:row; gap:var(--space-9); } .split > *{ flex:1; } }

/* ---------- Odpowiedzialność / overflow ---------- */
table{ border-collapse:collapse; }
.table-scroll{ overflow-x:auto; }

/* ---------- Długi tekst (polityka prywatności itp.) ---------- */
.prose{ display:flex; flex-direction:column; gap:var(--space-4); max-width:var(--container-narrow); }
.prose h2{ font-size:var(--fs-xl); margin-top:var(--space-6); scroll-margin-top:96px; }
.prose h3{ font-size:var(--fs-md); font-weight:var(--fw-semibold); font-family:var(--font-body); text-transform:uppercase; letter-spacing:var(--tracking-mid); color:var(--text-muted); margin-top:var(--space-3); }
.prose p{ font-size:var(--fs-sm); color:var(--text-body); }
.prose ul{ display:flex; flex-direction:column; gap:8px; padding-left:1.2em; list-style:disc; }
.prose li{ font-size:var(--fs-sm); color:var(--text-body); }
.prose a{ border-bottom-color:var(--border-accent); }