/* ============================================================
   LIDERSKA AKADEMIJA — by Kenan Crnkić
   1. Fontovi (self-hosted)      5. Vrijednosti
   2. Varijable / reset          6. Forma / prijava
   3. Header / navigacija        7. Footer
   4. Hero                       8. Responsive
   ============================================================ */

/* ============================================================
   1. FONTOVI — lokalni woff2, bez third-party zahtjeva
   ============================================================ */
@font-face{
  font-family:'Montserrat';
  font-style:normal;
  font-weight:300 700;
  font-display:swap;
  src:url(fonts/montserrat-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:'Montserrat';
  font-style:normal;
  font-weight:300 700;
  font-display:swap;
  src:url(fonts/montserrat-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Playfair Display';
  font-style:normal;
  font-weight:700 900;
  font-display:swap;
  src:url(fonts/playfair-display-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:'Playfair Display';
  font-style:normal;
  font-weight:700 900;
  font-display:swap;
  src:url(fonts/playfair-display-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Great Vibes';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url(fonts/great-vibes-sub-subset.woff2?v=2) format('woff2');
  unicode-range:U+20-22,U+27,U+2c-2e,U+30-39,U+3f,U+41-5a,U+61-7a,U+c1,U+c9,U+cd,U+d3,U+da,U+dd,U+e1,U+e9,U+ed,U+f3,U+fa,U+fd,U+106-107,U+10c-111,U+11a-11b,U+139-13a,U+13d-13e,U+143-144,U+147-148,U+154-155,U+158-15b,U+160-161,U+164-165,U+179-17a,U+17d-17e,U+1cd-1d4,U+1e6-1e9,U+1f0,U+1f4-1f5,U+21e-21f,U+301,U+30c,U+1e30-1e31,U+1e3e-1e3f,U+1e54-1e55,U+1e82-1e83,U+2013-2014,U+201c,U+201e;
}

/* ============================================================
   2. VARIJABLE / RESET
   ============================================================ */
:root{
  --bg:          #0a0c11;
  --bg-2:        #0e121a;
  --bg-3:        #0b0e15;
  --bg-4:        #090b10;
  --values-bg:   #080a0e;
  --footer-bg:   #070809;

  --panel:       #2b3140;
  --panel-hi:    #333a4a;
  --panel-line:  #3c4356;

  --gold:        #d9b45b;
  --gold-2:      #f0d79a;
  --gold-hero:   #d9b45b;
  --gold-grad:   linear-gradient(135deg,#c99b3d 0%,#f2dda3 45%,#cba24a 100%);

  --txt:         #ffffff;
  --txt-soft:    #ccd0d8;
  --txt-mute:    #9aa0ae;
  --err:         #ea8763;

  --field-txt:         #ffffff;
  --field-placeholder: #b3b8c4;
  --opt-bg:            #232833;
  --header-scroll-bg:  rgba(8,10,14,.9);
  --line-rgb:          255,255,255;

  --serif:  'Playfair Display', Georgia, 'Times New Roman', serif;
  --sans:   'Montserrat', system-ui, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --script: 'Great Vibes', 'Segoe Script', cursive;

  --wrap: 1200px;
  --pad:  28px;
  --head: 86px;
}

*,*::before,*::after{ box-sizing:border-box; }

html{
  scroll-behavior:smooth;
  scroll-padding-top:var(--head);
  -webkit-text-size-adjust:100%;
}

body{
  margin:0;
  background:var(--bg);
  color:var(--txt);
  font-family:var(--sans);
  font-size:16px;
  font-weight:400;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
  text-rendering:optimizeLegibility;
  transition:background-color .4s ease, color .4s ease;
}

img,picture{ max-width:100%; display:block; }
a{ text-decoration:none; color:inherit; }
ul{ margin:0; padding:0; list-style:none; }
button{ font:inherit; }

svg{
  width:100%; height:100%;
  fill:none; stroke:currentColor;
  stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round;
}

.container{
  width:100%;
  max-width:var(--wrap);
  margin-inline:auto;
  padding-inline:var(--pad);
}

::selection{ background:var(--gold); color:#14161c; }

/* pristupačnost: sakriveno samo vizualno */
.sr-only{
  position:absolute !important;
  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;
}

.skip-link{
  position:absolute;
  left:16px; top:-60px;
  z-index:200;
  padding:12px 20px;
  background:var(--gold);
  color:#14161c;
  font-size:13px;
  font-weight:700;
  letter-spacing:.1em;
  border-radius:0 0 6px 6px;
  transition:top .2s ease;
}
.skip-link:focus{ top:0; }

:focus-visible{
  outline:2px solid var(--gold);
  outline-offset:3px;
  border-radius:3px;
}

/* ============================================================
   BUTTONS
   ============================================================ */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  font-family:var(--sans);
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  text-align:center;
  cursor:pointer;
  border:0;
  transition:transform .25s ease, box-shadow .25s ease, filter .25s ease;
}
.btn-gold{
  background:var(--gold-grad);
  color:#16181f;
  box-shadow:0 12px 32px -14px rgba(217,180,91,.7);
}
.btn-gold:hover{
  transform:translateY(-2px);
  filter:brightness(1.06);
  box-shadow:0 18px 40px -14px rgba(217,180,91,.85);
}
.btn-gold:active{ transform:translateY(0); }
.btn[disabled]{ cursor:not-allowed; opacity:.7; transform:none !important; }

.btn-sm{ padding:13px 26px; font-size:11.5px; border-radius:4px; }
.btn-lg{ padding:20px 42px; font-size:13px; border-radius:4px; }
.btn-block{
  grid-column:1 / -1;
  width:100%;
  padding:22px;
  font-size:14px;
  border-radius:6px;
  margin-top:6px;
}

.ico{ width:18px; height:18px; flex:0 0 auto; stroke-width:2; }
.ico-send{ stroke-width:1.7; }

/* ============================================================
   3. HEADER
   ============================================================ */
.site-header{
  position:fixed;
  inset:0 0 auto 0;
  z-index:60;
  height:var(--head);
  display:flex;
  align-items:center;
  border-bottom:1px solid transparent;
  transition:background .35s ease, border-color .35s ease, backdrop-filter .35s ease;
}
.site-header.scrolled{
  background:var(--header-scroll-bg);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
  border-bottom-color:rgba(217,180,91,.16);
}

.header-inner{ display:flex; align-items:center; justify-content:space-between; }

.brand{ display:flex; align-items:center; gap:14px; flex:0 0 auto; }
.brand-logo{
  width:56px; height:56px;
  object-fit:contain;
  filter:drop-shadow(0 4px 12px rgba(0,0,0,.55));
}
.brand-text{ display:flex; flex-direction:column; line-height:1.25; }
.brand-text strong{ font-size:13.5px; font-weight:600; letter-spacing:.22em; color:#fff; transition:color .3s ease; }
.brand-text span{ font-size:10.5px; font-weight:400; letter-spacing:.34em; color:#9aa0ae; transition:color .3s ease; }

/* header je proziran preko (uvijek tamnog) heroa dok se ne skroluje -
   tekst tad ostaje konstantno svijetao; nakon skrola prelazi na temu */
.site-header.scrolled .brand-text strong{ color:var(--txt); }
.site-header.scrolled .brand-text span{ color:var(--txt-mute); }

/* ============================================================
   4. HERO
   ============================================================ */
.hero{
  position:relative;
  min-height:min(92vh,880px);
  display:flex;
  align-items:center;
  padding:calc(var(--head) + 46px) 0 64px;
  overflow:hidden;
  isolation:isolate;
}
.hero-media{ position:absolute; inset:0; z-index:-2; }
.hero-media picture{ width:100%; height:100%; display:block; }
.hero-img{
  width:100%; height:100%;
  object-fit:cover;
  object-position:62% 22%;
  filter:brightness(.95) contrast(1.02) saturate(.94);
}
.hero-shade{
  position:absolute; inset:0;
  background:
    radial-gradient(ellipse 62% 86% at 57% 42%,
      rgba(6,8,12,0) 0%, rgba(6,8,12,.14) 62%, rgba(6,8,12,.62) 100%),
    linear-gradient(90deg,
      rgba(6,8,12,.9) 0%, rgba(6,8,12,.68) 26%, rgba(7,9,14,.16) 46%,
      rgba(7,9,14,.02) 62%, rgba(7,9,14,.3) 88%, rgba(6,8,12,.6) 100%),
    linear-gradient(180deg,
      rgba(6,8,12,.6) 0%, rgba(6,8,12,0) 34%, rgba(6,8,12,.34) 84%, var(--bg) 100%);
}

.hero-inner{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) 250px;
  gap:56px;
  align-items:center;
}

.eyebrow{
  margin:0 0 22px;
  font-size:11.5px;
  font-weight:400;
  letter-spacing:.34em;
  text-transform:uppercase;
  color:#ccd0d8;
  line-height:2;
}

.hero-eyebrow{
  display:flex;
  align-items:center;
  gap:12px;
}
.eyebrow-accent{
  flex:0 0 auto;
  width:3px;
  height:30px;
  border-radius:2px;
  background:#ff3232;
  box-shadow:0 0 10px rgba(255,50,50,.55);
}

.hero-copy{ max-width:640px; }

/* "Uskoro" — veći, primarni naslov dok se prijave zvanično ne otvore */
.soon-tag{
  margin:0 0 2px;
  font-family:var(--serif);
  font-weight:900;
  font-size:clamp(46px,7.4vw,88px);
  line-height:.92;
  letter-spacing:.01em;
  color:#fff;
  text-shadow:0 6px 30px rgba(0,0,0,.6);
}

.hero-title{
  margin:0;
  font-family:var(--serif);
  font-weight:900;
  font-size:clamp(34px,4.9vw,64px);
  line-height:.96;
  letter-spacing:.01em;
}
.hero-title span{ display:block; }
.hero-title--sub{
  font-size:clamp(21px,2.6vw,32px);
  line-height:1.2;
}
.hero-title--sub span{ display:inline; }
.hero-title--sub .line-gold{ margin-right:.35em; }

.line-gold{
  background:linear-gradient(120deg,#b98f33 0%,#f4e0a8 42%,#cfa64c 78%,#e9cd8a 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
}
.line-white{ color:#fff; text-shadow:0 6px 30px rgba(0,0,0,.6); }

.hero-by{
  margin:16px 0 0;
  font-size:clamp(12.5px,1.1vw,15px);
  font-weight:400;
  letter-spacing:.4em;
  color:#eef0f4;
}
.hero-text{
  margin:26px 0 0;
  max-width:470px;
  font-size:14.5px;
  font-weight:300;
  line-height:1.85;
  color:#ccd0d8;
}

.hero-formula{
  margin:16px 0 0;
  max-width:470px;
  font-family:var(--sans);
  font-size:12.5px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  line-height:1.7;
  color:#fff;
}
.hero-formula .arrow{
  display:inline-block;
  margin:0 4px;
  color:var(--gold);
  font-weight:400;
}

.hero-actions{
  margin-top:36px;
  display:flex;
  align-items:center;
  gap:32px;
  flex-wrap:wrap;
}

/* citat — poravnat s dnom hero-copy bloka; prati njegovu visinu bez obzira na dužinu teksta */
.hero-quote{
  margin:0;
  align-self:end;
  padding-left:6px;
  padding-bottom:8px;
}
.q-mark{
  display:block;
  font-family:var(--serif);
  font-size:58px;
  line-height:.6;
  color:var(--gold-hero);
  margin-bottom:14px;
}
.hero-quote blockquote{
  margin:0;
  font-family:var(--serif);
  font-weight:700;
  font-size:15px;
  line-height:1.5;
  color:#f3f4f7;
}
.hero-quote figcaption{ margin-top:22px; }
.sign-img{
  width:150px;
  height:auto;
  opacity:.95;
  filter:drop-shadow(0 2px 8px rgba(0,0,0,.6));
}
.sign-rule{
  display:block;
  width:118px; height:1px;
  margin-top:10px;
  background:linear-gradient(90deg,var(--gold-hero),transparent);
}

/* ============================================================
   MANIFEST — centriran, editorijalni blok: veliki naslov,
   podnaslov, dvije kolone sa brojevima i zavrsna oznaka.
   ============================================================ */
.manifest{
  background:var(--bg);
  padding:96px 0 90px;
}

.manifest-kicker{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  margin:0 0 24px;
  font-size:11px;
  font-weight:700;
  letter-spacing:.38em;
  color:var(--gold);
}
.manifest-kicker .rule{
  width:44px;
  height:1px;
  background:rgba(var(--line-rgb),.25);
}

.manifest-title{
  margin:0 0 48px;
  text-align:center;
  font-family:var(--serif);
  font-weight:800;
  font-size:clamp(36px,6vw,62px);
  line-height:1.08;
  color:var(--txt);
}
.manifest-title em{
  display:block;
  margin-top:2px;
  font-style:italic;
  font-weight:700;
  background:linear-gradient(120deg,#b98f33 0%,#f4e0a8 42%,#cfa64c 78%,#e9cd8a 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
}

.manifest-list{
  list-style:none;
  margin:0;
  padding:0;
  text-align:left;
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:repeat(4,auto);
  grid-auto-flow:column;
  column-gap:64px;
  counter-reset:manifest;
}
.manifest-list li{
  counter-increment:manifest;
  display:flex;
  align-items:center;
  gap:18px;
  padding:20px 0;
  border-bottom:1px solid rgba(var(--line-rgb),.12);
}
.manifest-list li:nth-child(4),
.manifest-list li:last-child{ border-bottom:0; }

.manifest-list li::before{
  content:counter(manifest,decimal-leading-zero) ".";
  flex:0 0 auto;
  min-width:2ch;
  font-family:var(--serif);
  font-style:italic;
  font-weight:700;
  font-size:clamp(26px,2.6vw,34px);
  line-height:1;
  background:linear-gradient(120deg,#b98f33 0%,#f4e0a8 42%,#cfa64c 78%,#e9cd8a 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
}
.manifest-list .m-div{
  flex:0 0 auto;
  align-self:stretch;
  width:1px;
  background:rgba(217,180,91,.35);
}
.manifest-list .m-txt{
  flex:1 1 auto;
  min-width:0;
  font-size:14px;
  font-weight:300;
  line-height:1.5;
  color:var(--txt-soft);
}

/* ============================================================
   LIDER SE POSTAJE — kratak motivacioni blok, most ka prijavi
   ============================================================ */
.become{
  background:var(--bg);
  padding:72px 0 84px;
  text-align:center;
  border-top:1px solid rgba(var(--line-rgb),.08);
}
.become-inner{ max-width:640px; margin-inline:auto; }

.become-title{
  margin:0 0 26px;
  font-family:var(--serif);
  font-weight:800;
  font-size:clamp(26px,3.6vw,42px);
  line-height:1.22;
  color:var(--txt);
}
.become-title em{
  display:block;
  margin-top:2px;
  font-style:italic;
  font-weight:700;
  background:linear-gradient(120deg,#b98f33 0%,#f4e0a8 42%,#cfa64c 78%,#e9cd8a 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
}

.become-text{
  margin:0 0 14px;
  font-size:14.5px;
  font-weight:300;
  line-height:1.8;
  color:var(--txt-soft);
}

.become-lead{
  margin:24px 0 0;
  font-size:15px;
  font-weight:600;
  color:var(--gold-2);
}

/* ============================================================
   6. FORMA / PRIJAVA
   ============================================================ */
.apply{
  position:relative;
  padding:96px 0 100px;
  background:
    radial-gradient(1100px 620px at 50% -10%, rgba(217,180,91,.07), transparent 68%),
    linear-gradient(180deg,var(--bg-2) 0%,var(--bg-3) 55%,var(--bg-4) 100%);
  overflow:hidden;
  transition:background-color .4s ease, background-image .5s ease;
}
.apply::before,
.apply::after{
  content:"";
  position:absolute;
  width:340px; height:340px;
  border:1px solid rgba(217,180,91,.07);
  transform:rotate(45deg);
  pointer-events:none;
}
.apply::before{ top:60px; right:-120px; }
.apply::after{ bottom:40px; left:-150px; }

.apply-inner{ position:relative; z-index:1; text-align:center; }

.gold-eyebrow{
  color:var(--gold);
  font-size:11.5px;
  font-weight:600;
  letter-spacing:.4em;
  margin-bottom:14px;
}
.section-title{
  margin:0;
  font-family:var(--serif);
  font-weight:700;
  font-size:clamp(25px,3.1vw,38px);
  line-height:1.18;
  color:var(--txt);
}
.section-sub{
  margin:18px auto 46px;
  max-width:620px;
  font-size:15px;
  font-weight:300;
  line-height:1.8;
  color:var(--txt-soft);
}

.form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px 22px;
  max-width:1000px;
  margin-inline:auto;
  padding:clamp(28px,4vw,48px);
  text-align:left;
  background:
    linear-gradient(160deg, rgba(217,180,91,.06), rgba(217,180,91,0) 45%),
    rgba(255,255,255,.025);
  border:1px solid rgba(217,180,91,.16);
  border-radius:20px;
  box-shadow:0 40px 80px -40px rgba(0,0,0,.6);
}
.field{ position:relative; display:flex; }
.field.full{ grid-column:1 / -1; }

/* honeypot — nevidljivo za ljude, vidljivo botovima */
.hp{
  position:absolute !important;
  left:-9999px !important;
  top:auto;
  width:1px; height:1px;
  overflow:hidden;
  opacity:0;
  pointer-events:none;
}

.form input[type=text],
.form input[type=email],
.form input[type=tel],
.form textarea,
.form select{
  width:100%;
  font-family:var(--sans);
  font-size:14.5px;
  font-weight:400;
  color:var(--field-txt);
  background:var(--panel);
  border:1px solid var(--panel-line);
  border-radius:6px;
  padding:17px 20px;
  appearance:none;
  -webkit-appearance:none;
  transition:border-color .25s ease, background .25s ease, box-shadow .25s ease, color .25s ease;
}
.form textarea{ resize:vertical; min-height:118px; line-height:1.6; }
.form input::placeholder,
.form textarea::placeholder{ color:var(--field-placeholder); opacity:1; }

.form input:hover,
.form textarea:hover,
.form select:hover{ border-color:#525a70; }

.form input:focus,
.form textarea:focus,
.form select:focus{
  outline:none;
  border-color:var(--gold);
  background:var(--panel-hi);
  box-shadow:0 0 0 3px rgba(217,180,91,.14);
}

.form select{ color:var(--field-placeholder); cursor:pointer; padding-right:52px; }
.form select.filled{ color:var(--field-txt); }
.form select option{ background:var(--opt-bg); color:var(--field-txt); }

.select-wrap .chev{
  position:absolute;
  right:20px; top:50%;
  transform:translateY(-50%);
  width:18px; height:18px;
  color:#c6cbd6;
  pointer-events:none;
}

.field.invalid input,
.field.invalid textarea,
.field.invalid select{
  border-color:#d9603f;
  box-shadow:0 0 0 3px rgba(217,96,63,.14);
}

/* pristanak */
.consent{
  display:flex;
  align-items:flex-start;
  gap:13px;
  margin-top:4px;
  padding:20px 2px 0;
  border-top:1px solid rgba(var(--line-rgb),.09);
}
.consent input[type=checkbox]{
  appearance:none;
  -webkit-appearance:none;
  width:20px; height:20px;
  flex:0 0 auto;
  margin-top:2px;
  background:var(--panel);
  border:1px solid var(--panel-line);
  border-radius:4px;
  cursor:pointer;
  transition:background .2s ease, border-color .2s ease;
}
.consent input[type=checkbox]:hover{ border-color:#525a70; }
.consent input[type=checkbox]:checked{
  background:var(--gold);
  border-color:var(--gold);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2314161c' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%3E%3C/svg%3E");
  background-size:15px;
  background-position:center;
  background-repeat:no-repeat;
}
.consent label{
  font-size:12.5px;
  font-weight:300;
  line-height:1.65;
  color:var(--txt-mute);
  cursor:pointer;
}
.consent.invalid input[type=checkbox]{ border-color:#d9603f; box-shadow:0 0 0 3px rgba(217,96,63,.14); }

.form-note{
  grid-column:1 / -1;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin:14px 0 0;
  font-size:12px;
  font-weight:300;
  color:var(--txt-mute);
  text-align:center;
}
.ico-mail{ width:16px; height:16px; flex:0 0 auto; color:var(--gold); margin-top:2px; }
.form-note a{
  color:var(--gold-2);
  font-weight:500;
  text-decoration:underline;
  text-underline-offset:2px;
  transition:color .2s ease;
}
.form-note a:hover{ color:var(--gold); }

.form-status{
  grid-column:1 / -1;
  margin:2px 0 0;
  min-height:22px;
  text-align:center;
  font-size:13.5px;
  font-weight:500;
}
.form-status.ok{ color:var(--gold-2); }
.form-status.err{ color:var(--err); }

/* ============================================================
   7. FOOTER
   ============================================================ */
.site-footer{ background:var(--footer-bg); border-top:1px solid rgba(217,180,91,.12); transition:background-color .4s ease; }
.footer-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:48px;
  padding-block:40px;
}
.footer-points{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  row-gap:26px;
  flex:1 1 auto;
}
.footer-points li{
  display:flex;
  align-items:center;
  gap:16px;
  padding:6px 28px;
  border-left:1px solid rgba(var(--line-rgb),.1);
}
.footer-points li:nth-child(3n+1){ border-left:0; padding-left:0; }

.fp-ico{
  width:46px; height:46px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border:1px solid rgba(217,180,91,.5);
  border-radius:50%;
  color:var(--gold);
  transition:background .3s ease, border-color .3s ease;
}
.fp-ico svg{ width:21px; height:21px; stroke-width:1.8; }
.footer-points li:hover .fp-ico{ background:rgba(217,180,91,.12); border-color:var(--gold); }

.footer-points .fp-text{
  font-size:11px;
  font-weight:700;
  letter-spacing:.1em;
  line-height:1.5;
  text-transform:uppercase;
  color:var(--txt);
}

.footer-sign-wrap{
  flex:0 0 auto;
  padding-left:24px;
  border-left:1px solid rgba(var(--line-rgb),.08);
  text-align:right;
}
.footer-sign{
  margin:0;
  font-family:var(--script);
  font-size:29px;
  line-height:1.15;
  color:var(--gold-2);
}
.footer-sign em{ font-style:normal; padding-left:34px; display:inline-block; }
.footer-sign-rule{
  display:inline-block;
  width:70px;
  height:1px;
  margin-top:14px;
  background:linear-gradient(90deg,transparent,var(--gold) 100%);
}

.footer-bottom{
  display:flex;
  align-items:center;
  gap:24px;
  padding-block:20px;
  border-top:1px solid rgba(var(--line-rgb),.06);
}

.footer-brand{
  display:flex;
  align-items:center;
  gap:12px;
  flex:0 0 auto;
  padding-right:24px;
  border-right:1px solid rgba(var(--line-rgb),.08);
}
.footer-brand picture{ width:40px; height:40px; flex:0 0 auto; }
.footer-brand img{ width:100%; height:100%; object-fit:contain; }
.footer-brand-text{ display:flex; flex-direction:column; line-height:1.25; }
.footer-brand-text strong{ font-size:12px; font-weight:600; letter-spacing:.18em; color:var(--txt); }
.footer-brand-text span{ font-size:9px; font-weight:400; letter-spacing:.3em; color:var(--txt-mute); }

.footer-copy{
  flex:1 1 auto;
  margin:0;
  font-size:11.5px;
  font-weight:300;
  letter-spacing:.06em;
  color:var(--txt-mute);
}

.footer-brand-mini{
  flex:0 0 auto;
  margin:0;
  font-size:11.5px;
  font-weight:300;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--txt-mute);
}

/* glatka smjena teme na tekstualnim elementima bez vlastite tranzicije */
.section-sub,
.gold-eyebrow,
.footer-bottom p,
.consent label,
.form-note,
.ico-mail,
.form-status.ok,
.form-status.err{
  transition:color .3s ease;
}

/* ============================================================
   REVEAL ANIMACIJA
   ============================================================ */
.reveal{
  opacity:0;
  transform:translateY(26px);
  transition:opacity .8s ease, transform .8s ease;
}
.reveal.in{ opacity:1; transform:none; }

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
  .reveal{ opacity:1; transform:none; }
}

/* ============================================================
   8. RESPONSIVE
   ============================================================ */

/* --- veliki ekrani / 4K --- */
@media (min-width:1600px){
  :root{ --wrap:1340px; }
  .hero{ min-height:min(88vh,940px); }
  .hero-text{ max-width:520px; font-size:15.5px; }
  .hero-formula{ max-width:520px; font-size:13.5px; }
  .hero-inner{ grid-template-columns:minmax(0,1fr) 310px; }
  .hero-quote blockquote{ font-size:17px; }
}

/* --- laptop --- */
@media (max-width:1280px){
  :root{ --wrap:1100px; }
  .header-inner{ gap:24px; }
  .footer-points li{ padding:6px 24px; }
}

/* --- tablet landscape / mali laptop --- */
@media (max-width:1080px){
  .hero{ padding:calc(var(--head) + 40px) 0 60px; }
  .hero-inner{ grid-template-columns:1fr; gap:44px; }
  .hero-copy{ max-width:none; }
  .soon-tag{ font-size:clamp(40px,10vw,64px); }

  /* slika više ne prati (sada mnogo veću) visinu teksta — fiksna
     "banner" zona na vrhu, tako da Kenan ostane uvijek u kadru */
  .hero-media,
  .hero-shade{ inset:0 0 auto 0; height:min(72vh,620px); }
  .hero-quote{
    max-width:460px;
    align-self:start;
    padding:26px 0 0;
    border-top:1px solid rgba(217,180,91,.2);
  }
  .q-mark{ font-size:50px; }
  .hero-img{ object-position:62% 20%; }

  .manifest{ padding:76px 0 70px; }
  .manifest-list{ column-gap:40px; }

  .become{ padding:56px 0 64px; }

  .footer-inner{ flex-direction:column; align-items:flex-start; gap:30px; }
  .footer-sign-wrap{
    width:100%;
    padding:18px 0 0;
    border-left:0;
    border-top:1px solid rgba(var(--line-rgb),.08);
    text-align:left;
  }
}

/* --- tablet portrait / mobilna navigacija --- */
@media (max-width:860px){
  :root{ --head:74px; }

  .hero{ min-height:auto; padding:calc(var(--head) + 38px) 0 54px; }
  .hero-media,
  .hero-shade{ height:min(76vh,660px); }
  .hero-img{ object-position:50% 22%; filter:brightness(.96) contrast(1.02) saturate(.92); }
  .hero-shade{
    background:
      linear-gradient(180deg,
        rgba(6,8,12,.2) 0%, rgba(6,8,12,.12) 38%,
        rgba(6,8,12,.65) 80%, var(--bg) 100%),
      linear-gradient(90deg, rgba(6,8,12,.82) 0%, rgba(6,8,12,.4) 48%, rgba(6,8,12,.1) 100%);
  }
  .eyebrow{ font-size:9.5px; letter-spacing:.22em; line-height:1.7; margin-bottom:12px; }
  .soon-tag{ font-size:clamp(26px,7vw,38px); }
  .hero-title--sub{ font-size:clamp(13px,3.6vw,17px); }
  .hero-by{ font-size:10.5px; letter-spacing:.24em; margin-top:10px; }
  .hero-text{ max-width:300px; font-size:12px; line-height:1.65; margin-top:14px; }
  .hero-formula{ font-size:10px; margin-top:10px; }
  .hero-actions{ gap:22px; margin-top:20px; }
  .btn-lg{ padding:18px 34px; }

  .manifest{ padding:60px 0 56px; }
  .manifest-kicker{ margin-bottom:18px; }
  .manifest-title{ margin-bottom:34px; }
  .manifest-list{
    grid-template-columns:1fr;
    grid-template-rows:none;
    grid-auto-flow:row;
  }
  .manifest-list li:nth-child(4){ border-bottom:1px solid rgba(var(--line-rgb),.12); }
  .manifest-list li:last-child{ border-bottom:0; }
  .manifest-list li::before{ font-size:24px; }

  .become{ padding:44px 0 50px; }
  .become-title{ margin-bottom:20px; }

  .apply{ padding:74px 0 78px; }
  .apply::before,.apply::after{ display:none; }
  .form{ grid-template-columns:1fr; gap:15px; border-radius:16px; }
  .section-sub{ margin-bottom:38px; }
  .section-sub br{ display:none; }
  .form textarea{ min-height:104px; }

  .footer-points{ grid-template-columns:1fr 1fr; gap:22px 0; }
  .footer-points li{ padding:4px 20px; }
  .footer-points li:nth-child(odd){ border-left:0; padding-left:0; }

  .footer-bottom{ flex-direction:column; align-items:flex-start; gap:14px; }
  .footer-brand{ border-right:0; padding-right:0; }
}

/* --- veliki telefoni --- */
@media (max-width:640px){
  :root{ --pad:22px; }
  .hero-title{ font-size:clamp(32px,8.4vw,44px); }
  .hero-title--sub{ font-size:clamp(17px,4.2vw,21px); }
  .soon-tag{ font-size:clamp(30px,8vw,44px); }
  .hero-by{ font-size:13px; letter-spacing:.26em; }
  .hero-quote{ max-width:none; }
  .hero-quote blockquote{ font-size:16px; }
}

/* --- telefoni --- */
@media (max-width:520px){
  :root{ --pad:20px; --head:70px; }

  body{ font-size:15.5px; }

  .brand-logo{ width:44px; height:44px; }
  .brand-text strong{ font-size:11.5px; letter-spacing:.15em; }
  .brand-text span{ font-size:9px; letter-spacing:.28em; }

  .hero{ padding:calc(var(--head) + 30px) 0 46px; }
  .hero-title{ font-size:clamp(30px,8.8vw,40px); }
  .hero-title--sub{ font-size:clamp(12px,3.4vw,15px); }
  .soon-tag{ font-size:clamp(24px,6.8vw,32px); }
  .hero-text{ font-size:11.5px; line-height:1.65; }
  .hero-formula{ font-size:9.5px; }
  .hero-actions{ flex-direction:column; align-items:stretch; gap:18px; margin-top:22px; }
  .btn-lg{ width:100%; padding:18px 22px; }
  .q-mark{ font-size:44px; margin-bottom:8px; }
  .sign-img{ width:126px; }

  .manifest{ padding:48px 0 46px; }
  .manifest-kicker{ letter-spacing:.26em; }
  .manifest-kicker .rule{ width:28px; }
  .manifest-list li{ padding:15px 0; gap:14px; }
  .manifest-list li::before{ font-size:21px; min-width:1.8ch; }

  .apply{ padding:60px 0 64px; }
  .form{ padding:24px 20px; border-radius:14px; }
  .gold-eyebrow{ letter-spacing:.28em; font-size:10.5px; }
  .section-sub{ font-size:14px; }
  .form input[type=text],
  .form input[type=email],
  .form input[type=tel],
  .form textarea,
  .form select{ padding:15px 16px; font-size:15px; }
  .select-wrap .chev{ right:16px; }
  .btn-block{ padding:19px; font-size:12.5px; letter-spacing:.1em; }
  .form-note{ font-size:11.5px; align-items:flex-start; text-align:left; }

  .footer-points{ grid-template-columns:1fr; gap:18px; }
  .footer-points li{ padding:0; border-left:0; }
  .footer-sign{ font-size:26px; }
  .footer-sign em{ padding-left:24px; }
  .footer-sign-rule{ display:none; }

  .footer-brand-mini{ width:100%; }
}

/* --- vrlo mali telefoni (320–360px) --- */
@media (max-width:360px){
  :root{ --pad:16px; }
  .brand-text span{ display:none; }
  .hero-title{ font-size:29px; }
  .hero-title--sub{ font-size:14px; }
  .soon-tag{ font-size:26px; }
  .hero-by{ font-size:11.5px; letter-spacing:.2em; }
  .btn-sm{ padding:11px 18px; font-size:10.5px; }
  .footer-sign{ font-size:23px; }
}

/* --- telefon u landscape orijentaciji --- */
@media (max-height:520px) and (orientation:landscape){
  .hero{ min-height:auto; padding:calc(var(--head) + 26px) 0 40px; }
  .hero-title{ font-size:clamp(30px,5.4vw,44px); }
  .hero-title--sub{ font-size:clamp(18px,3.2vw,26px); }
  .soon-tag{ font-size:clamp(34px,7vw,54px); }
  .hero-actions{ margin-top:24px; }
}

/* --- ekrani sa finim pokazivačem: hover efekti samo tu --- */
@media (hover:none){
  .btn-gold:hover{ transform:none; box-shadow:0 12px 32px -14px rgba(217,180,91,.7); }
}

/* --- print --- */
@media print{
  .site-header,.hero-media,.hero-actions,.form,.skip-link{ display:none !important; }
  body{ background:#fff; color:#000; }
  .hero-title,.section-title,.manifest-title,.become-title,.footer-points .fp-text{ color:#000 !important; }
  .line-gold,
  .soon-tag,
  .manifest-title em,
  .become-title em,
  .manifest-list li::before{ -webkit-text-fill-color:#8a6a1f; color:#8a6a1f; }
}