* {
	box-sizing: border-box;
}

body {
	  background-color: white;
	  color: #000;
	  font-family: -apple-system, BlinkMacSystemFont, sans-serif;
	  font-size: 16px;
	  -ms-overflow-style: none; /* for Internet Explorer, Edge */
	  scrollbar-width: none; /* for Firefox */
	  overflow-y: scroll; 
	  margin:0 auto;
	  padding: 0;
}

a {
	  color: #fc7904;
	  text-decoration: none;
}

.back{
	display: block;
	position: fixed;
	top: 1rem;
	left: 1rem;
	width: 130px;
	height: 35px;
	border-radius: 35px;
	color: #fff;
	background: #198cff;
	box-shadow: 2px 2px 2px #c5bcbc;
	}
	
.back-text{
	postion: relative;
	font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
	font-size: 1.3rem;
	margin-left: 20%;
	margin-top: 25%;
	}
.header{
	display: flex;
	text-align: center;
	margin:0 auto;
	width: 1280px;
	height: 90px;
	background: #d3d3d3;
}

.zpr_screening{
	display: block;
	text-align: center;
	margin:0 auto;
	width: 100%;
	min-height: 2300px;
}

.footer{
	display: flex;
	text-align: center;
	margin:0 auto;
	width: 100%;
	height: 190px;
	background: #d3d3d3;
	margin-bottom: 0;
	margin-top: 1rem;
}

.top_1{
	margin:0 auto;
	margin-top: 1rem;
	margin-bottom: 1rem;
	width: 100%;
	min-height: 200px;
}

.top{
	
    background-image: url(https://traffic.idmnet.pl/showcase/assets/img/idm-logo-trans.png);
    height: 60px;
    width: 120px;
    background-size: cover;
}

.content{
	margin:0 auto;
	width: 1280px;
	min-height: 2200px;
	background: #d3d3d3;
}

.line{
	display: flex;
	min-height: 500px; 
	padding: 1rem;
}

.image-big{
	display:block;
	width: 600px;
	height: 520px;
	background: grey;
	margin-left: 1rem;
	margin-right: 1rem;
}

.image-med{
	display:block;
	width: 300px;
	height: 250px;
	background: grey;
	margin-left: 0.1rem;
	margin-right: 0.1rem;
	margin-bottom: 0.5rem;
}

.text-med{
	display:block;
	width: 300px;
	height: 40px;
	background: grey;
	margin-left: 0.5rem;
	margin-right: 0.5rem;
	margin-bottom: 0.7rem;
}

.text-long{
	display:block;
	width: 600px;
	height: 40px;
	background: grey;
	margin-left: 0.5rem;
	margin-right: 0.5rem;
	margin-bottom: 0.7rem;
}

.col{
	display: block;
}
.divider{
	margin-top: 3rem;
	margin-bottom: 3rem;
}
.halfpage{
	display:block;
	width: 300px;
	height: 600px;
	background: grey;
	margin-left: 1rem;
	margin-right: 1rem;
	background: #d3d3d3;
}

.back:hover{
	background-color: #00001c;
	color: #c5bcbc;
	box-shadow: 2px 2px 2px #c5bcbc;
}

/* Container placed in the bottom-right corner */
		:root{
			--bg:#ffffff;
			--panel-bg: #fff;
			--accent: #0b74da;
			--text:#111;
			--muted:#555;
			--border: rgba(0,0,0,0.12);
			--shadow: 0 8px 24px rgba(0,0,0,0.08);
			--radius: 12px;
			font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
			--text-box-color: rgb(149, 149, 149);
			--size: 50px;
  			--color: white;
  			--ring-duration: 2s;
		}
		.spec-window{
			position: fixed;
			left: 20px;
			bottom: 20px;
			width: 340px; /* outer width to allow some padding — content area narrower */
			max-width: calc(100% - 40px);
			background: var(--panel-bg);
			color: var(--text);
			border-radius: var(--radius);
			box-shadow: var(--shadow);
			border: 1px solid var(--border);
			overflow: hidden;
			z-index: 9999;
			display: flex;
			flex-direction: column;
			padding: 10px;
			font-size: 12px;
		}


		/* Header */
		.spec-header{
			display:flex;
			align-items:center;
			justify-content:space-between;
			gap:12px;
			padding:12px 14px;
			background: linear-gradient(90deg, rgba(11,116,218,0.06), rgba(11,116,218,0.02));
			border-bottom: 1px solid rgba(11,116,218,0.06);
		}
		.spec-header h3{
			margin:0;
			font-size:13px;
			font-weight:700;
			color:var(--accent);
			letter-spacing:0.1px;
		}
		.spec-header .controls{
			display:flex;
			gap:8px;
			align-items:center;
		}
		.spec-close{
			appearance:none;
			border:0;
			background:transparent;
			padding:6px;
			border-radius:8px;
			cursor:pointer;
			font-size:14px;
			color:var(--muted);
		}
		.spec-close:hover{ background: rgba(0,0,0,0.04); }
		.spec-body { font-family: "Roboto", sans-serif; }

/* Styl przycisku/odnośnika */
		.back-btn {
		  position: fixed;
		  top: 16px;
		  left: 16px;
		  display: inline-flex;
		  align-items: center;
		  gap: 10px;
		  padding: 10px 14px;
		  border-radius: 10px;
		  text-decoration: none;
		  background: rgba(17, 24, 39, 0.85); /* ciemne tło */
		  color: #ffffff;
		  font-weight: 600;
		  font-size: 14px;
		  box-shadow: 0 6px 18px rgba(15,23,42,0.25);
		  transform-origin: left top;
		  transition: transform 180ms ease, filter 180ms ease, box-shadow 180ms ease;
		  -webkit-tap-highlight-color: transparent;
		  z-index: 9999;
		}

		/* Ikona (opcjonalne) */
		.back-btn .icon {
		  width: 16px;
		  height: 16px;
		  display: inline-block;
		  flex: 0 0 16px;
		  /* prosta strzałka SVG background */
		  background: no-repeat center/contain url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="%23ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 18l-6-6 6-6"/></svg>');
		}

		/* Hover / focus efekt */
		.back-btn:hover,
		.back-btn:focus {
		  transform: translateY(-2px) scale(1.06);
		  filter: brightness(1.08);
		  box-shadow: 0 10px 30px rgba(15,23,42,0.30);
		  text-decoration: none;
		}

		/* Wyraźne obramowanie dostępności przy klawiaturze */
		.back-btn:focus-visible {
		  outline: 3px solid rgba(99,102,241,0.18);
		  outline-offset: 3px;
		}

		/* Aktywny stan (kliknięcie) */
		.back-btn:active {
		  transform: translateY(0) scale(0.99);
		  box-shadow: 0 6px 14px rgba(15,23,42,0.22);
		}

		/* Szanuj użytkowników z reduced motion */
		@media (prefers-reduced-motion: reduce) {
		  .back-btn {
			transition: none;
		  }
		  .back-btn:hover,
		  .back-btn:focus,
		  .back-btn:active {
			transform: none;
		  }
		}

		/* Małe ekrany — nieco mniejsze odstępy */
		@media (max-width: 420px) {
		  .back-btn {
			padding: 8px 12px;
			font-size: 13px;
			border-radius: 8px;
			top: 12px;
			left: 12px;
		  }
		}