/* =========================
   GLOBAL HEADINGS
   ========================= */



/* Section titles (H2) */
.section-title {
  text-align: left;
  font-size: 26px;
  color: #463f46;
  margin-top: 40px;    /* blizu eyebrowa */
  margin-bottom: 16px; /* pa onda paragrafi */
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: bold;
  line-height: 1.3;
}

/* Section titles (H2) za registration-info page */
.page-section.registration-info .section-title {
  color: #28a745;
}


/* Eyebrow (mali label, obično H3) */
.eyebrow {
  color: #e01a1a;            /* brend plava */
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-top: 32px;   /* dovoljno da “udahne” od prethodnog teksta */
  margin-bottom: 6px; /* blizu H2, jer su povezani */
  display: inline-block;     /* da ne zauzima cijeli red */
  background: #fff2f2;       /* svijetloplava pločica */
  padding: 2px 8px;
  border-radius: 4px;
}

/* Ako H2 odmah slijedi eyebrow → smanji razmak da budu povezani */
.eyebrow + .section-title {
  margin-top: 8px;   /* manji razmak jer je eyebrow već dao prostor */
}

/* Hero title (H1 na homepage/index) */
.hero-title {
  text-align: center;
  font-size: 44px;
  color: #006699;
  margin: 20px 0 16px;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: bold;
  line-height: 1.2;
}

/* Hero subtitle (paragraf ispod hero title-a) */
.hero-subtitle {
  text-align: center;
  font-size: 18px;
  color: #333;
  margin: -4px 0 18px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               "Helvetica Neue", Arial, sans-serif;
  line-height: 1.4;
}




/* Reset */
/* Glavni nivo (već imaš) */
.page-section ul {
  list-style: none;
  margin: 16px 0;
  padding-left: 22px;
}

.page-section ul li {
  position: relative;
  margin-bottom: 12px;
  padding-left: 36px;   /* prostor za bullet */
  font-size: 16px;
  line-height: 1.6;
}

/* NIVO 1 – glavni bullet (već imaš) */
.page-section ul li::before {
  content: "↬";                 
  position: absolute;
  left: 0;
  top: 4px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #feffff;          
  color: rgb(234, 17, 17);      /* crvena ikona */
  font-size: 16px;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* NIVO 2 – podnivoi */
.page-section ul ul li {
  padding-left: 30px;
  font-size: 15px;
  margin-bottom: 8px;
}

.page-section ul ul li::before {
  content: "›";          
  background: none;     
  color: #28a745;        /* zelena */
  font-size: 18px;       /* veće */
  font-weight: bold;
  left: 5px;
  top: 2px;
}

/* NIVO 3 – dublji podnivoi */
.page-section ul ul ul li {
  padding-left: 30px;   /* malo više prostora */
  font-size: 15px;      /* da ne bude presitno */
  margin-bottom: 6px;
}

.page-section ul ul ul li::before {
  content: "-";           
  background: none;       
  color: #122ecc;            /* tamnija siva da se bolje vidi */
  font-size: 18px;        /* povećano */
  left: 10px;             /* centrirano u odnosu na tekst */
  top: 3px;               /* poravnato po visini teksta */
}



/* OL stil – numerisana lista */
/* OL stil – numerisana lista */
.page-section ol {
  list-style: none;       /* makni default brojeve */
  margin: 16px 0;
  padding-left: 22px;
  counter-reset: item;    /* reset counter */
}

.page-section ol li {
  position: relative;
  margin-bottom: 12px;
  padding-left: 36px;     /* prostor za broj */
  font-size: 16px;
  line-height: 1.6;
  counter-increment: item; /* dodaj broj */
}

.page-section ol li::before {
  content: counter(item);   /* prikaži broj */
  position: absolute;
  left: 0;
  top: 4px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #feffff;      /* svijetla pozadina kruga */
  color: rgb(17, 128, 234); /* plavi broj (možeš promijeniti) */
  font-size: 14px;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Links for support */
.support-link {
  color: #0077b6;         /* plava - prijateljska */
  font-weight: bold;
  text-decoration: none;
  transition: color 0.3s ease, border-color 0.3s ease;
}

.support-link:hover {
  color: #28a745;         /* zelena na hover */
  border-color: #28a745;
}



/* CEO potpis */
.ceo-signature {
  margin-top: 40px;
  padding-top: 20px;
  border-top: 1px solid #ddd;
  text-align: right;           /* ili center, po želji */
  color: #555;
}

.ceo-signature p {
  margin: 0;
  font-size: 14px;
  font-style: italic;
  color: #666;
}

.ceo-signature h4 {
  margin: 4px 0 0;
  font-size: 16px;
  font-weight: bold;
}

/* Brand boje */
.brand span:nth-child(1) { color: #d22; }     /* No = crveno */
.brand span:nth-child(2) { color: #f90; }     /* Fake = narančasto */
.brand span:nth-child(3) { color: #00a8a8; }  /* Biz = teal */



/* Responsivno fino podešavanje */
@media (max-width: 480px) {
  .page-title   { font-size: 32px; }
  .hero-title   { font-size: 36px; }
  .section-title{ font-size: 26px; }
  .short-title  { font-size: 28px; }
  .long-title   { font-size: 32px; }
}