/* Index.hr-inspired editorial shell for Standpunkt. Local-only CSS, no behavioural changes. */
:root{
  --ix-accent:#181a1e;
  --ix-accent-dark:#2a303b;
  --ix-text:#151515;
  --ix-muted:#777;
  --ix-line:#e7e7e7;
  --ix-soft:#f6f6f6;
  --ix-content:720px;
  --ix-shell:980px;
}

html{scroll-behavior:smooth}
body.q-container-b102,body{
  margin:0 !important;
  background:#fff !important;
  color:var(--ix-text) !important;
  font-family:Georgia,"Times New Roman",serif !important;
}

/* Header */
html body .site-header{
  background:#181a1e !important;
  border:0 !important;
  border-bottom:1px solid var(--ix-line) !important;
  position:relative !important;
  z-index:20 !important;
}
html body .site-header .header-inner{
  max-width:var(--ix-shell) !important;
  min-height:48px !important;
  margin:0 auto !important;
  padding:0 16px !important;
  display:flex !important;
  align-items:stretch !important;
  justify-content:flex-start !important;
  gap:0 !important;
}
html body .wertblick-logo{
  display:flex !important;
  align-items:center !important;
  min-height:48px !important;
  background:transparent !important;
  color:#fff !important;
  padding:0 16px !important;
  font-family:"Cambria Math","Segoe UI Symbol",Georgia,serif !important;
  text-decoration:none !important;
}
html body .wertblick-logo .logo-name{
  color:#fff !important;
  font: 400 36px/1.05 "Cambria Math","Segoe UI Symbol",Georgia,serif !important;
  letter-spacing:0 !important;
  text-transform:none !important;
  white-space:nowrap !important;
}
html body .indexhr-nav{
  display:flex;
  align-items:center;
  min-height:48px;
  padding:0 16px;
  border-right:1px solid var(--ix-line);
  font:700 11px/1 Arial,Helvetica,sans-serif;
  color:#666;
  text-transform:uppercase;
  letter-spacing:.04em;
}
html body .anzeige-bar{
  background:#fff !important;
  border-bottom:1px solid var(--ix-line) !important;
}
html body .anzeige-bar .anzeige-bar-inner{
  max-width:var(--ix-shell) !important;
  margin:0 auto !important;
  padding:5px 16px !important;
  text-align:right !important;
  font:700 10px/1.4 Arial,Helvetica,sans-serif !important;
  text-transform:uppercase !important;
  letter-spacing:.04em !important;
}

/* Page shell */
html body #__nuxt,
html body #__layout,
html body .page-wrapper,
html body .page-content{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  background:#fff !important;
}
html body .breaking-news{display:none !important}
html body main.main-content{
  width:min(calc(100% - 32px),var(--ix-content)) !important;
  max-width:var(--ix-content) !important;
  margin:0 auto !important;
  padding:24px 0 0 !important;
  float:none !important;
}
html body main.main-content > article{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
}
html body .article-body.article-body--conversion{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  color:var(--ix-text) !important;
  font-family:Georgia,"Times New Roman",serif !important;
}

html body .indexhr-section-label{
  margin:0 0 12px !important;
  color:var(--ix-accent) !important;
  font:800 11px/1.2 Arial,Helvetica,sans-serif !important;
  text-transform:uppercase !important;
  letter-spacing:.04em !important;
}

html body .article-body.article-body--conversion > h1.article-title,
html body .article-body.article-body--conversion > .article-title{
  margin:0 0 13px !important;
  padding:0 !important;
  color:#111 !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-size:38px !important;
  font-weight:700 !important;
  line-height:1.08 !important;
  letter-spacing:-.025em !important;
}
html body .article-body.article-body--conversion > h1.article-title strong{
  font:inherit !important;
}
html body .article-body.article-body--conversion .article-meta{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  gap:5px 12px !important;
  margin:0 0 14px !important;
  padding:0 !important;
  color:#666 !important;
  font:400 11px/1.35 Arial,Helvetica,sans-serif !important;
}
html body .article-body.article-body--conversion .article-meta::before{
  content:"Repère Capital";
  color:#222;
  font-weight:700;
}
html body .article-body.article-body--conversion .sponsored-label{
  order:3 !important;
  width:100% !important;
  margin-top:1px !important;
  color:var(--ix-accent) !important;
  font:800 10px/1.3 Arial,Helvetica,sans-serif !important;
  text-transform:uppercase !important;
}
html body .article-body.article-body--conversion .article-media{
  margin:0 0 18px !important;
  padding:0 !important;
}
html body .article-body.article-body--conversion .article-media img,
html body .article-body.article-body--conversion .info__img,
html body .article-body.article-body--conversion img{
  max-width:100% !important;
  height:auto !important;
  border-radius:0 !important;
}
html body .article-body.article-body--conversion figcaption,
html body .article-body.article-body--conversion .article-media figcaption{
  margin:5px 0 0 !important;
  color:#777 !important;
  font:italic 11px/1.35 Arial,Helvetica,sans-serif !important;
}
html body .article-body.article-body--conversion > p,
html body .article-body.article-body--conversion .faq-item p,
html body .article-body.article-body--conversion blockquote p,
html body .article-body.article-body--conversion .article-list li,
html body .article-body.article-body--conversion .article-steps li{
  margin:0 0 15px !important;
  padding:0 !important;
  color:#1b1b1b !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-size:16px !important;
  line-height:1.54 !important;
  letter-spacing:0 !important;
}
html body .article-body.article-body--conversion h2,
html body .article-body.article-body--conversion h3,
html body .article-body.article-body--conversion h4{
  margin:24px 0 10px !important;
  color:#111 !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-size:20px !important;
  font-weight:700 !important;
  line-height:1.2 !important;
  letter-spacing:-.01em !important;
}
html body .article-body.article-body--conversion .article-list,
html body .article-body.article-body--conversion .article-steps{
  margin:0 0 18px 20px !important;
  padding:0 !important;
}
html body .article-body.article-body--conversion .article-list li,
html body .article-body.article-body--conversion .article-steps li{
  margin-bottom:8px !important;
}
html body .article-body.article-body--conversion blockquote{
  margin:18px 0 !important;
  padding:0 0 0 15px !important;
  border-left:3px solid var(--ix-accent) !important;
}
html body .article-body.article-body--conversion .process-flow,
html body .article-body.article-body--conversion .faq-item,
html body .article-body.article-body--conversion .access-note{
  margin:18px 0 !important;
  padding:14px 15px !important;
  border:1px solid #ddd !important;
  border-left:3px solid var(--ix-accent) !important;
  border-radius:0 !important;
  background:#fafafa !important;
  color:#222 !important;
  box-shadow:none !important;
  font:400 14px/1.5 Arial,Helvetica,sans-serif !important;
}
html body .article-body.article-body--conversion .process-flow strong{
  color:#111 !important;
}
html body .article-body.article-body--conversion a:not(.form-submit):not(.article-cta){
  color:var(--ix-accent) !important;
  font-weight:700 !important;
}
html body .article-body.article-body--conversion .article-cta{
  display:block !important;
  width:100% !important;
  margin:18px 0 !important;
  padding:12px 16px !important;
  border:0 !important;
  border-radius:0 !important;
  background:var(--ix-accent) !important;
  color:#fff !important;
  font:800 13px/1.25 Arial,Helvetica,sans-serif !important;
  text-align:center !important;
  text-decoration:none !important;
}
html body .article-body.article-body--conversion .article-cta:hover{background:var(--ix-accent-dark) !important}

/* Form: retain existing fields/API, only present it as an editorial callout */
html body .article-body.article-body--conversion .form{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  margin:28px 0 22px !important;
  padding:18px !important;
  border:1px solid #d9d9d9 !important;
  border-top:4px solid var(--ix-accent) !important;
  border-radius:0 !important;
  background:#fff !important;
  color:#111 !important;
  box-shadow:none !important;
}
html body .article-body.article-body--conversion .form > .title{
  display:block !important;
  margin:0 0 15px !important;
  padding:0 !important;
  color:#111 !important;
  font:700 20px/1.2 Georgia,"Times New Roman",serif !important;
  letter-spacing:-.01em !important;
}
html body .article-body.article-body--conversion .form > .title::before,
html body .article-body.article-body--conversion .form > .title::after{display:none !important;animation:none !important}
html body #form_block,
html body #form_block .final-page__form,
html body #form_block .custom-form__wrapper{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body #form_block form#lead-form{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  gap:12px !important;
  background:transparent !important;
}
html body #form_block .form-group{
  margin:0 !important;
  min-width:0 !important;
}
html body #form_block .form-group:nth-of-type(3),
html body #form_block .form-group:nth-of-type(4){grid-column:auto !important}
html body #form_block .form-group label{
  margin:0 0 4px !important;
  color:#222 !important;
  font:700 11px/1.3 Arial,Helvetica,sans-serif !important;
}
html body #form_block .form-input,
html body #form_block input.form-input,
html body #form_block input.input,
html body #form_block .iti input{
  width:100% !important;
  min-width:0 !important;
  height:42px !important;
  margin:0 !important;
  padding:8px 11px !important;
  border:1px solid #cfcfcf !important;
  border-radius:0 !important;
  outline:0 !important;
  background:#fff !important;
  color:#111 !important;
  box-shadow:none !important;
  font:400 14px/1 Arial,Helvetica,sans-serif !important;
}
html body #form_block .iti{width:100% !important}
html body #form_block .iti input{padding-left:88px !important}
html body #form_block .iti__country-container,
html body #form_block .iti__selected-country,
html body #form_block .iti__selected-country-primary{pointer-events:none !important;cursor:default !important}
html body #form_block .iti__arrow,
html body #form_block .iti__dropdown-content,
html body #form_block .iti__country-list,
html body #form_block .iti__search-input{display:none !important}
/* One-country phone field: CSS-only lock, no dropdown JavaScript required. */
html body #form_block .iti__country-container,
html body #form_block .iti__selected-country,
html body #form_block .iti__selected-country-primary{
  pointer-events:none !important;
  cursor:default !important;
  user-select:none !important;
}
html body .iti__dropdown-content,
html body .iti__country-list{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}
html body #submit-btn,
html body #form_block .form-submit{
  grid-column:auto !important;
  width:100% !important;
  min-height:44px !important;
  margin:2px 0 0 !important;
  padding:11px 16px !important;
  border:0 !important;
  border-radius:0 !important;
  background:var(--ix-accent) !important;
  color:#fff !important;
  box-shadow:none !important;
  font:800 13px/1.3 Arial,Helvetica,sans-serif !important;
  cursor:pointer !important;
}
html body #submit-btn:hover{background:var(--ix-accent-dark) !important}
html body #form_block input.valid{background:#f4fff4 !important;border-color:#70a970 !important;color:#111 !important}
html body #form_block input.error{background:#f5f6f7 !important;border-color:#7a7f87 !important;color:#111 !important}

/* Related block patterned after the reference article */
html body .indexhr-related{
  width:100%;
  margin:32px 0 30px;
  padding-top:14px;
  border-top:1px solid var(--ix-line);
  font-family:Arial,Helvetica,sans-serif;
}
html body .indexhr-related__title{
  margin:0 0 12px;
  color:#111;
  font:700 17px/1.2 Georgia,"Times New Roman",serif;
}
html body .indexhr-related__grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
}
html body .indexhr-related__card{display:block;min-width:0;color:inherit;text-decoration:none}
html body .indexhr-related__card img{
  display:block;
  width:100%;
  aspect-ratio:16/10;
  object-fit:cover;
  margin:0 0 6px;
}
html body .indexhr-related__card p{
  margin:0 !important;
  color:#222 !important;
  font:700 11px/1.25 Arial,Helvetica,sans-serif !important;
}

/* Comments */
html body section.comments.article-detail__comments{
  width:100% !important;
  max-width:none !important;
  margin:0 0 38px !important;
  padding:14px 0 0 !important;
  border-top:1px solid var(--ix-line) !important;
  background:#fff !important;
  font-family:Arial,Helvetica,sans-serif !important;
}
html body section.comments .comments__title{
  margin:0 0 10px !important;
  color:#111 !important;
  font:800 12px/1.2 Arial,Helvetica,sans-serif !important;
  text-transform:uppercase !important;
  letter-spacing:.03em !important;
}
html body .standpunkt-comments{
  display:block !important;
  margin:0 !important;
}
html body article.standpunkt-comment{
  display:flex !important;
  align-items:flex-start !important;
  gap:9px !important;
  margin:0 !important;
  padding:11px 0 !important;
  border:0 !important;
  border-bottom:1px solid #ededed !important;
  background:#fff !important;
  box-shadow:none !important;
}
html body .standpunkt-comment__avatar{
  flex:0 0 60px !important;
  width:60px !important;
  height:60px !important;
}
html body .standpunkt-comment__avatar img{
  display:block !important;
  width:60px !important;
  height:60px !important;
  border-radius:50% !important;
  object-fit:cover !important;
}
html body .standpunkt-comment__head{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:2px 7px !important;
  margin:0 0 4px !important;
  font:400 10px/1.25 Arial,Helvetica,sans-serif !important;
}
html body .standpunkt-comment__head strong{color:#222 !important;font-size:11px !important}
html body .standpunkt-comment__head span{color:#8a8a8a !important;font-size:10px !important}
html body .standpunkt-comment p{
  margin:0 !important;
  color:#242424 !important;
  font:400 12px/1.42 Arial,Helvetica,sans-serif !important;
}
html body .comments .article-cta{
  display:block !important;
  width:fit-content !important;
  margin:14px 0 0 !important;
  padding:9px 13px !important;
  border:0 !important;
  border-radius:0 !important;
  background:var(--ix-accent) !important;
  color:#fff !important;
  font:800 11px/1.2 Arial,Helvetica,sans-serif !important;
}

/* Footer */
html body footer.site-footer{
  width:100% !important;
  margin:50px 0 0 !important;
  padding:0 !important;
  border-top:1px solid var(--ix-line) !important;
  background:#2a303b !important;
  color:#666 !important;
  font-family:Arial,Helvetica,sans-serif !important;
}
html body footer.site-footer .footer-inner{
  width:min(calc(100% - 32px),var(--ix-shell)) !important;
  max-width:var(--ix-shell) !important;
  margin:0 auto !important;
  padding:26px 0 28px !important;
}
html body footer.site-footer .footer-logo{
  display:inline-block !important;
  margin:0 0 18px !important;
  padding:10px 13px !important;
  background:transparent !important;
  color:#fff !important;
  font: 400 28px/1.1 "Cambria Math","Segoe UI Symbol",Georgia,serif !important;
  text-transform:none !important;
  text-align:left !important;
}
html body footer.site-footer .footer-warning{
  max-width:100% !important;
  margin:0 0 14px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  color:#333 !important;
  font:700 11px/1.4 Arial,Helvetica,sans-serif !important;
  text-align:left !important;
}
html body footer.site-footer .footer-warning strong{font:inherit !important}
html body footer.site-footer .footer-desc{
  max-width:100% !important;
  margin:0 0 8px !important;
  color:#777 !important;
  font:400 10px/1.45 Arial,Helvetica,sans-serif !important;
  text-align:left !important;
}
html body footer.site-footer .company-footer-block{
  max-width:100% !important;
  margin:15px 0 0 !important;
  padding:13px 0 0 !important;
  border-top:1px solid var(--ix-line) !important;
  color:#777 !important;
  text-align:left !important;
  font:400 10px/1.45 Arial,Helvetica,sans-serif !important;
}
html body footer.site-footer .company-footer-block__title{
  margin:0 0 5px !important;
  color:#333 !important;
  font:700 10px/1.35 Arial,Helvetica,sans-serif !important;
}
html body footer.site-footer .company-footer-block__text,
html body footer.site-footer .company-footer-block a{color:#777 !important;font:inherit !important}
html body footer.site-footer .footer-nav-links{
  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:flex-start !important;
  gap:5px 14px !important;
  margin:17px 0 0 !important;
  padding:12px 0 0 !important;
  border-top:1px solid var(--ix-line) !important;
}
html body footer.site-footer .footer-nav-links a{
  color:#555 !important;
  font:700 10px/1.3 Arial,Helvetica,sans-serif !important;
  text-decoration:none !important;
}
html body footer.site-footer .footer-copy{
  margin:12px 0 0 !important;
  color:#aaa !important;
  font:400 9px/1.4 Arial,Helvetica,sans-serif !important;
  text-align:left !important;
}

@media (max-width:760px){
  html body .site-header .header-inner{padding:0 12px !important}
  html body .wertblick-logo{padding:0 12px !important}
  html body .wertblick-logo .logo-name{font-size: 35px !important;}
  html body .indexhr-nav{padding:0 11px;font-size:10px}
  html body .anzeige-bar .anzeige-bar-inner{padding-left:12px !important;padding-right:12px !important}
  html body main.main-content{width:min(calc(100% - 24px),var(--ix-content)) !important;padding-top:18px !important}
  html body .article-body.article-body--conversion > h1.article-title,
  html body .article-body.article-body--conversion > .article-title{font-size:29px !important;line-height:1.08 !important}
  html body .article-body.article-body--conversion > p,
  html body .article-body.article-body--conversion .faq-item p,
  html body .article-body.article-body--conversion .article-list li,
  html body .article-body.article-body--conversion .article-steps li{font-size:16px !important;line-height:1.5 !important}
  html body #form_block form#lead-form{grid-template-columns:1fr !important}
  html body #form_block .form-group:nth-of-type(3),
  html body #form_block .form-group:nth-of-type(4),
  html body #submit-btn,
  html body #form_block .form-submit{grid-column:auto !important}
  html body .indexhr-related__grid{grid-template-columns:repeat(2,1fr);gap:14px 10px}
}

@media (max-width:420px){
  html body .indexhr-nav{display:none}
  html body .article-body.article-body--conversion > h1.article-title,
  html body .article-body.article-body--conversion > .article-title{font-size:27px !important}
  html body .article-body.article-body--conversion .form{padding:14px !important}
}

/* Related/comments live immediately after the article in the original DOM; keep them aligned to the editorial column. */
html body .indexhr-related,
html body section.comments.article-detail__comments{
  width:min(calc(100% - 32px),var(--ix-content)) !important;
  max-width:var(--ix-content) !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
html body .indexhr-related{margin-top:30px !important;margin-bottom:30px !important}
html body section.comments.article-detail__comments{margin-top:0 !important;margin-bottom:38px !important}
@media(max-width:760px){
  html body .indexhr-related,
  html body section.comments.article-detail__comments{width:calc(100% - 24px) !important}
}

/* Safety override against legacy publisher CSS that expects runtime classes/JS. */
html,html body,html body#q-container-b102,html body .page-wrapper,html body .page-content,html body main.main-content{
  visibility:visible !important;
  opacity:1 !important;
}
html body#q-container-b102{display:block !important;min-height:100vh !important;overflow-x:hidden !important}


/* Phone field: keep Croatian dial code and local number on one visual line. */
html body #form_block .iti,
html body #form_block .iti__tel-input,
html body #form_block input#phone{
  white-space:nowrap !important;
}
html body #form_block input#phone{
  font-family:Arial,Helvetica,sans-serif !important;
  font-size:13px !important;
  font-weight:400 !important;
  letter-spacing:0 !important;
  line-height:1 !important;
  padding-left:82px !important;
  padding-right:8px !important;
  overflow:hidden !important;
  text-overflow:clip !important;
}
html body #form_block .iti__selected-dial-code{
  font-family:Arial,Helvetica,sans-serif !important;
  font-size:13px !important;
  font-weight:400 !important;
  line-height:1 !important;
  white-space:nowrap !important;
}
/* Repere Capital: reference typography + footer text tone */
:root{
  --repere-editorial-font:"The Antiqua B",Georgia,"Times New Roman",serif;
  --repere-footer-text:#e8eaee;
}

/* Use the reference editorial type style across the site.
   The publication wordmark keeps its dedicated display stack. */
html body,
html body *{
  font-family:var(--repere-editorial-font) !important;
}
html body .wertblick-logo,
html body .wertblick-logo *,
html body footer.site-footer .footer-logo,
html body footer.site-footer .footer-logo *{
  font-family:"Cambria Math","Segoe UI Symbol",Georgia,serif !important;
}

/* Reference footer text tone. */
html body footer.site-footer,
html body footer.site-footer .footer-warning,
html body footer.site-footer .footer-warning *,
html body footer.site-footer .footer-desc,
html body footer.site-footer .company-footer-block,
html body footer.site-footer .company-footer-block *,
html body footer.site-footer .company-footer-block a,
html body footer.site-footer .footer-nav-links,
html body footer.site-footer .footer-nav-links a,
html body footer.site-footer .footer-copy{
  color:var(--repere-footer-text) !important;
  -webkit-text-fill-color:var(--repere-footer-text) !important;
}
html body footer.site-footer .footer-logo,
html body footer.site-footer .footer-logo *{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}