/* reset */
* { margin:0; padding:0; box-sizing: border-box; }
html,body { height:100%; }

/* tło */
body {
  background-image: url("../images/background.png");
  background-color: #000;
  background-size: cover;
  background-repeat: no-repeat;
  font-family: 'Fredoka One', sans-serif;
  color: white;
  -webkit-font-smoothing:antialiased;
}

/* NAV - desktop first with responsive shrink */
.navigator-topbar-content{
  position: fixed;
  top: 16px;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 32px);
  max-width: 1200px;
  height: 72px;
  display:flex;
  align-items:center;
  gap: 12px;
  padding: 0 16px;
  background: rgba(0,0,0,0.9);
  border-radius: 10px;
  z-index: 60;
}

/* title */
.navigator-topbar-title-container { width: 18%; display:flex; justify-content:center; align-items:center; }
.navigator-topbar-title { font-size: 26px; color: #fff; }

/* main menu - visible on wide screens */
.navigator-topbar-menu-content { width: 60%; display:flex; justify-content:center; align-items:center; }
.navigator-topbar-menu-list { list-style:none; display:flex; gap: 40px; font-size:18px; }
.navigator-topbar-menu-list a { color: #fff; text-decoration:none; }
.navigator-topbar-media-container { width: 22%; display:flex; justify-content:center; gap:18px; align-items:center; }

/* icons */
.navigator-topbar-icon { width: 32px; height:auto; display:block; }

/* HAMBURGER - hidden on desktop */
.nav-toggle {
  display:none;
  background:none;
  border:0;
  cursor:pointer;
  padding:8px;
}
.hamburger{
  display:block;
  width:28px;
  height:2px;
  background:#fff;
  position:relative;
}
.hamburger::before, .hamburger::after{
  content:"";
  position:absolute;
  left:0;
  width:28px;
  height:2px;
  background:#fff;
}
.hamburger::before { top:-8px; }
.hamburger::after  { top:8px; }

/* MOBILE DRAWER */
.mobile-drawer{
  position: fixed;
  top:0;
  left:0;
  height:100vh;
  width: 280px;
  max-width: 80%;
  background: #000;
  transform: translateX(-110%);
  transition: transform 0.28s ease;
  z-index: 80;
  padding: 40px 20px;
  overflow-y:auto;
}
.mobile-drawer.open { transform: translateX(0); }
.mobile-drawer nav ul { list-style:none; display:flex; flex-direction:column; gap:18px; }
.mobile-drawer nav a { color:#fff; font-size:18px; text-decoration:none; }
.drawer-media { margin-top: 24px; display:flex; gap:12px; }
.drawer-media img { width:36px; height:auto; }

/* overlay */
.drawer-overlay {
  position:fixed;
  inset:0;
  background: rgba(0,0,0,0.45);
  z-index:70;
}

/* INTRO */
.intro-page-container{
  width: calc(100% - 32px);
  max-width:1200px;
  margin: 120px auto 24px; /* leave space for fixed navbar */
  display:flex;
  gap: 12px;
  align-items:center;
  justify-content:space-between;
  min-height: calc(60vh);
  padding: 20px;
}
.intro-page-info { width:50%; display:flex; align-items:center; }
.intro-page-text {
  font-size: clamp(32px, 8vw, 92px);
  line-height:1;
  color: #fff;
  word-break:break-word;
}
.intro-page-icon { width:45%; display:flex; justify-content:center; align-items:center; }
.intro-page-icon-set { width: clamp(160px, 35vw, 500px); height:auto; }

/* CONTENT (dawny footer-container) */
.content-container {
  width:100%;
  background: rgb(0, 0, 0);
  padding: 36px 0;
  margin-top: 24px;
}
.footer-content {
  width: calc(100% - 32px);
  max-width: 1200px;
  margin: 0 auto;
  display:flex;
  gap: 24px;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
}
.GPtext {
  flex: 1 1 55%;
  font-style: italic;
  line-height: 1.5;
  font-size: clamp(16px, 2.2vw, 20px);
  color: white;
  padding: 12px;
  text-align:left;
  max-width:60ch;
}
.GPtext ul { list-style: none; margin-top:12px; padding-left:0; }
.GPtext li { padding-left: 1.6em; margin-bottom: 0.6em; position:relative; }
.GPtext li::before{
  content:"";
  position:absolute;
  left:0;
  top:0.5em;
  width:0.45em;
  height:0.45em;
  background:#fff;
  border-radius:50%;
}
.phoneImg { flex: 0 0 35%; display:flex; align-items:center; justify-content:center; min-width:160px; }
.phoneImg-set { width: 100%; max-width: 320px; height:auto; object-fit:contain; }

/* SITE FOOTER with ® */
.site-footer { background: #000; padding: 14px 0; text-align:center; color:#ffffff; }
.site-footer-inner { max-width:1200px; margin:0 auto; font-size:14px; }
.registered { font-weight:700; margin-left:6px; }

/* LINKS style */
a:link, a:visited { color: #fff; text-decoration:none; }
a:hover, a:active { color: #b6b6b6; text-decoration:underline; }

/* RESPONSIVE BREAKPOINTS */
@media (max-width: 920px) {
  .navigator-topbar-menu-content { display:none; } /* hide desktop menu */
  .nav-toggle { display:block; margin-left:auto; } /* show hamburger */
  .navigator-topbar-media-container { display:none; } /* optional hide icons on small */
  .navigator-topbar-title-container { width:auto; }
  .intro-page-container { margin-top: 100px; flex-direction:column; align-items:center; text-align:center; gap:20px; }
  .intro-page-info, .intro-page-icon { width:100%; }
  .footer-content { padding: 0 12px; }
  .GPtext { order:1; text-align:center; }
  .phoneImg { order:2; width:100%; }
}

/* very small devices */
@media (max-width: 420px) {
  .intro-page-text { font-size: clamp(22px, 10vw, 48px); }
  .mobile-drawer { width: 85%; }
  .GPtext { font-size: 14px; }
}