@charset "UTF-8";
@keyframes flip {
  from {
    transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    animation-timing-function: ease-out;
  }
  40% {
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    animation-timing-function: ease-out;
  }
  50% {
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    animation-timing-function: ease-in;
  }
  80% {
    transform: perspective(400px);
    animation-timing-function: ease-in;
  }
  to {
    transform: perspective(400px);
    animation-timing-function: ease-in;
  }
}
.animated {
  animation-duration: 1s;
  animation-fill-mode: both;
}
.animated.flip {
  -webkit-backface-visibility: visible;
  backface-visibility: visible;
  animation-name: flip;
}
.animated.infinite {
  animation-iteration-count: infinite;
}

/*======================= CSS Reset ===========================*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, section, main, footer, header, figure, aside, input, textarea, i, mark, *:before, *:after {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
  vertical-align: top;
  background: transparent;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

html, body {
  width: 100%;
}

html {
  overflow-y: scroll;
  overflow-x: hidden;
}

body {
  overflow: hidden;
}

ol, ul {
  list-style: none;
}

:focus {
  outline: 0;
}

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

table, table td tr {
  border: none;
  border-collapse: collapse;
}

button, a, input, textarea, select {
  background: none;
  border: 0;
  color: inherit;
  font: inherit;
  line-height: normal;
  overflow: visible;
  padding: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

/* Roboto */
@font-face {
  font-family: "Roboto-Light";
  src: url("/fonts/Roboto-Light.woff2") format("woff2"), url("/fonts/Roboto-Light.ttf") format("truetype");
  font-weight: 300;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: "Roboto-Regular";
  src: url("/fonts/Roboto-Regular.woff2") format("woff2"), url("/fonts/Roboto-Regular.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: "Roboto-Italic";
  src: url("/fonts/Roboto-Italic.woff2") format("woff2"), url("/fonts/Roboto-Italic.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
  font-style: italic;
}
@font-face {
  font-family: "Roboto-Medium";
  src: url("/fonts/Roboto-Medium.woff2") format("woff2"), url("/fonts/Roboto-Medium.ttf") format("truetype");
  font-weight: 500;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: "Roboto-Bold";
  src: url("/fonts/Roboto-Bold.woff2") format("woff2"), url("/fonts/Roboto-Bold.ttf") format("truetype");
  font-weight: 700;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: "Roboto-Black";
  src: url("/fonts/Roboto-Black.woff2") format("woff2"), url("/fonts/Roboto-Black.ttf") format("truetype");
  font-weight: 900;
  font-display: swap;
  font-style: normal;
}
/* Alegreya SC */
@font-face {
  font-family: "AlegreyaSC-Regular";
  src: url("/fonts/AlegreyaSC-Regular.woff2") format("woff2"), url("/fonts/AlegreyaSC-Regular.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: "AlegreyaSC-Italic";
  src: url("/fonts/AlegreyaSC-Italic.woff2") format("woff2"), url("/fonts/AlegreyaSC-Italic.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
  font-style: italic;
}
@font-face {
  font-family: "AlegreyaSC-Medium";
  src: url("/fonts/AlegreyaSC-Medium.woff2") format("woff2"), url("/fonts/AlegreyaSC-Medium.ttf") format("truetype");
  font-weight: 500;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: "AlegreyaSC-MediumItalic";
  src: url("/fonts/AlegreyaSC-MediumItalic.woff2") format("woff2"), url("/fonts/AlegreyaSC-MediumItalic.ttf") format("truetype");
  font-weight: 500;
  font-display: swap;
  font-style: italic;
}
@font-face {
  font-family: "AlegreyaSC-Bold";
  src: url("/fonts/AlegreyaSC-Bold.woff2") format("woff2"), url("/fonts/AlegreyaSC-Bold.ttf") format("truetype");
  font-weight: 700;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: "AlegreyaSC-BoldItalic";
  src: url("/fonts/AlegreyaSC-BoldItalic.woff2") format("woff2"), url("/fonts/AlegreyaSC-BoldItalic.ttf") format("truetype");
  font-weight: 700;
  font-display: swap;
  font-style: italic;
}
@font-face {
  font-family: "AlegreyaSC-ExtraBold";
  src: url("/fonts/AlegreyaSC-ExtraBold.woff2") format("woff2"), url("/fonts/AlegreyaSC-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: "AlegreyaSC-ExtraBoldItalic";
  src: url("/fonts/AlegreyaSC-ExtraBoldItalic.woff2") format("woff2"), url("/fonts/AlegreyaSC-ExtraBoldItalic.ttf") format("truetype");
  font-weight: 800;
  font-display: swap;
  font-style: italic;
}
@font-face {
  font-family: "AlegreyaSC-Black";
  src: url("/fonts/AlegreyaSC-Black.woff2") format("woff2"), url("/fonts/AlegreyaSC-Black.ttf") format("truetype");
  font-weight: 900;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: "AlegreyaSC-BlackItalic";
  src: url("/fonts/AlegreyaSC-BlackItalic.woff2") format("woff2"), url("/fonts/AlegreyaSC-BlackItalic.ttf") format("truetype");
  font-weight: 900;
  font-display: swap;
  font-style: italic;
}
/* Bree Serif */
@font-face {
  font-family: "BreeSerif-Regular";
  src: url("/fonts/BreeSerif-Regular.woff2") format("woff2"), url("/fonts/BreeSerif-Regular.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
  font-style: normal;
}
/* ========== Typography styles ========== */
a, button {
  text-decoration: none;
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
  cursor: pointer;
}

.button {
  font-size: 16px;
  font-family: "Roboto-Medium";
  background-color: #FFD700;
  color: #000;
  height: 48px;
  line-height: 48px;
  padding: 0 20px;
  display: inline-block;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
}
.button:hover {
  background-color: #e1be00;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -ms-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}

.text-center {
  text-align: center !important;
}

.text-left {
  text-align: left !important;
}

.text-right {
  text-align: right !important;
}

/*======================= Grid ===========================*/
.row {
  width: auto;
  display: block;
  margin: 0 -5px;
  position: relative;
  clear: both;
}
.row:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}
@media only screen and (max-width: 767px) {
  .row {
    margin: 0;
  }
}
.row > .column {
  padding: 0 5px;
  float: left;
}
.row > .column.pull-right {
  float: right;
}
@media only screen and (max-width: 1279px) {
  .row > .column.tablet-hide {
    display: none;
  }
}
@media only screen and (max-width: 1023px) {
  .row > .column.sm-tablet-hide {
    display: none;
  }
}
.row > .column.masonry-column {
  margin-bottom: 20px;
}
@media only screen and (max-width: 767px) {
  .row > .column {
    padding: 5px 0;
  }
}
.row > .column.__12 {
  width: 100%;
}
.row > .column.__11 {
  width: 91.666666%;
}
.row > .column.__10 {
  width: 83.333333%;
}
.row > .column.__9 {
  width: 75%;
}
.row > .column.__8 {
  width: 66.666666%;
}
.row > .column.__7 {
  width: 58.333333%;
}
.row > .column.__6 {
  width: 50%;
}
.row > .column.__5 {
  width: 41.666666%;
}
.row > .column.__41 {
  width: 37%;
}
.row > .column.__4 {
  width: 33.333333%;
}
.row > .column.__3 {
  width: 25%;
}
.row > .column.__2 {
  width: 16.666666%;
}
.row > .column.__1 {
  width: 8.333333%;
}
@media only screen and (max-width: 1440px) {
  .row > .column.llt__12 {
    width: 100%;
  }
  .row > .column.llt__8 {
    width: 66.666666%;
  }
  .row > .column.llt__4 {
    width: 33.333333%;
  }
}
@media only screen and (max-width: 1279px) {
  .row > .column.lt__6 {
    width: 100%;
  }
  .row > .column.lt__5 {
    width: 83.333333%;
  }
  .row > .column.lt__4 {
    width: 66.666666%;
  }
  .row > .column.lt__3 {
    width: 50%;
  }
  .row > .column.lt__2 {
    width: 33.333333%;
  }
  .row > .column.lt__1 {
    width: 16.666666%;
  }
}
@media only screen and (max-width: 1023px) {
  .row > .column.st__6 {
    width: 100%;
  }
  .row > .column.st__5 {
    width: 83.333333%;
  }
  .row > .column.st__4 {
    width: 66.666666%;
  }
  .row > .column.st__3 {
    width: 50%;
  }
  .row > .column.st__2 {
    width: 33.333333%;
  }
  .row > .column.st__1 {
    width: 16.666666%;
  }
  .row > .column.st__hide {
    display: none;
  }
}
@media only screen and (max-width: 767px) {
  .row > .column.m__3, .row > .column.__12, .row > .column.__11, .row > .column.__10, .row > .column.__9, .row > .column.__8, .row > .column.__7, .row > .column.__6, .row > .column.__5, .row > .column.__4, .row > .column.__3, .row > .column.__2, .row > .column.__1, .row > .column.lt__6, .row > .column.lt__5, .row > .column.lt__4, .row > .column.lt__3, .row > .column.lt__2, .row > .column.lt__1, .row > .column.st__6, .row > .column.st__5, .row > .column.st__4, .row > .column.st__3, .row > .column.st__2, .row > .column.st__1 {
    width: 100%;
  }
  .row > .column.m__1 {
    width: 33.333333%;
    padding: 5px;
  }
  .row > .column.m__2 {
    width: 66.333333%;
    padding: 5px;
  }
  .row > .column.no-padding {
    padding: 0 !important;
  }
}
.row.block-row.__1-block > .column {
  width: 100%;
}
.row.block-row.__2-block > .column {
  width: 50%;
}
.row.block-row.__3-block > .column {
  width: 33.3333333%;
}
.row.block-row.__4-block > .column {
  width: 25%;
}
.row.block-row.__5-block > .column {
  width: 20%;
}
.row.block-row.__6-block > .column {
  width: 16.666666666%;
}
.row.block-row.__7-block > .column {
  width: 14.285714%;
}
.row.block-row.__8-block > .column {
  width: 12.5%;
}
@media only screen and (max-width: 1279px) {
  .row.block-row.lt__1-block > .column {
    width: 100%;
  }
  .row.block-row.lt__2-block > .column {
    width: 50%;
  }
  .row.block-row.lt__3-block > .column {
    width: 33.3333333%;
  }
  .row.block-row.lt__4-block > .column {
    width: 25%;
  }
  .row.block-row.lt__5-block > .column {
    width: 20%;
  }
  .row.block-row.lt__6-block > .column {
    width: 16.666666666%;
  }
}
@media only screen and (max-width: 1023px) {
  .row.block-row.st__1-block > .column {
    width: 100%;
  }
  .row.block-row.st__2-block > .column {
    width: 50%;
  }
  .row.block-row.st__3-block > .column {
    width: 33.3333333%;
  }
  .row.block-row.st__4-block > .column {
    width: 25%;
  }
  .row.block-row.st__5-block > .column {
    width: 20%;
  }
  .row.block-row.st__6-block > .column {
    width: 16.666666666%;
  }
  .row.block-row > .column.st__6 {
    width: 100%;
  }
}
@media only screen and (max-width: 767px) {
  .row.block-row.__1-block > .column, .row.block-row.__2-block > .column, .row.block-row.__3-block > .column, .row.block-row.__4-block > .column, .row.block-row.__5-block > .column, .row.block-row.__6-block > .column, .row.block-row.__7-block > .column, .row.block-row.__8-block > .column {
    width: 100%;
  }
  .row.block-row.m__1-block > .column {
    width: 100%;
  }
  .row.block-row.m__2-block > .column {
    width: 50%;
    padding: 0 10px;
  }
  .row.block-row.m__3-block > .column {
    width: 33.3333333%;
  }
  .row.block-row.m__4-block > .column {
    width: 25%;
  }
}
.row.__0 {
  margin: 0;
}
.row.__0 > .column {
  padding: 0;
}
.row.__5 {
  margin: 0 -5px;
}
.row.__5 > .column {
  padding: 0 5px;
}
.row.__60 {
  margin: 0 -30px;
}
.row.__60 > .column {
  padding: 0 30px;
}
@media only screen and (max-width: 1279px) {
  .row.__60 {
    margin: 0 -10px;
  }
  .row.__60 > .column {
    padding: 0 10px;
  }
}
.row.__30 {
  margin: 0 -15px;
}
.row.__30 > .column {
  padding: 0 15px;
}
@media only screen and (max-width: 1279px) {
  .row.__30 {
    margin: 0 -5px;
  }
  .row.__30 > .column {
    padding: 0 5px;
  }
}
.row.__40 {
  margin: 0 -20px;
}
.row.__40 > .column {
  padding: 0 20px;
}
@media only screen and (max-width: 1279px) {
  .row.__40 {
    margin: 0 -5px;
  }
  .row.__40 > .column {
    padding: 0 5px;
  }
}
.row.__20 {
  margin: 0 -10px;
}
.row.__20 > .column {
  padding: 0 10px;
}
.row.__inline-row {
  text-align: center;
}
.row.__inline-row > .column {
  display: inline-block;
  float: none;
  margin: 0 -2px 10px -2px;
}
.row.__masonry {
  margin: 0 -10px;
}
.row.__masonry > .column {
  margin-bottom: 20px;
  padding: 0 10px;
}
.row.__centered-row {
  text-align: center;
}
.row.__centered-row > .column {
  display: inline-block;
  float: none;
  margin: 0;
}
@media only screen and (max-width: 1279px) {
  .row.__centered-row-small {
    text-align: center;
  }
}
@media only screen and (max-width: 1279px) {
  .row.__centered-row-small > .column {
    display: inline-block;
    float: none;
    margin: 0;
  }
}

.field {
  margin-bottom: 25px;
  position: relative;
}
.field input {
  width: 100%;
  display: block;
  padding: 0 15px;
  color: #fff;
  height: 50px;
  line-height: 50px;
  background-color: #6D7874;
  border: 1px solid #FFD700;
  font-size: 16px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -ms-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}
.field input[type=file] {
  display: none;
}
.field input::placeholder {
  color: #fff;
}
.field textarea {
  width: 100%;
  color: #fff;
  height: 250px;
  padding: 15px;
  background-color: #6D7874;
  border: 1px solid #FFD700;
  font-size: 16px;
  resize: none;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
}
.field textarea:hover {
  background-color: #6D7874;
}
.field textarea:focus {
  background-color: #6D7874;
}
.field textarea::placeholder {
  color: #fff;
}
.field label {
  font-family: "Roboto-Regular";
  font-size: 16px;
  text-transform: uppercase;
  padding-bottom: 10px;
  padding-left: 20px;
  display: inline-block;
  color: #fff;
}
.field .warning-text {
  position: absolute;
  color: darkred;
  font-size: 12px;
  font-family: "Roboto-Regular";
  font-style: italic;
  bottom: -17px;
  left: 14px;
  display: none;
}
.field .warning-text.warning-text-area {
  bottom: 3px;
}
@media only screen and (max-width: 1279px) {
  .field .warning-text {
    font-size: 9px;
    bottom: -12px;
  }
}
.field .warning {
  border: 1px solid darkred;
}

.filed-file {
  width: 100%;
  display: block;
  padding: 0;
  color: #707070;
  height: 50px;
  line-height: 50px;
  background-color: #EBEBEB;
  border: 1px dashed #707070;
  font-size: 15px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -ms-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}
.filed-file label {
  padding: 0 15px;
  display: block;
  width: 100%;
  height: 50px;
  line-height: 50px;
}
.filed-file label span {
  display: block;
  width: 100%;
  height: 50px;
  line-height: 50px;
}
@media only screen and (max-width: 767px) {
  .filed-file {
    background-color: #fff;
    height: 40px;
    line-height: 40px;
  }
  .filed-file label {
    height: 40px;
    line-height: 40px;
    font-size: 9px !important;
    padding: 0 5px 0 15px;
  }
  .filed-file label span {
    height: 40px;
    line-height: 40px;
    font-size: 10px !important;
  }
}
@media only screen and (max-width: 359px) {
  .filed-file label {
    font-size: 9px !important;
  }
  .filed-file label span {
    font-size: 8px !important;
  }
}

.checkbox {
  padding: 0 0 10px 0;
  margin-left: 4px;
  display: inline-block;
}
.checkbox:last-child {
  padding: 0;
}
.checkbox label {
  font-family: "Roboto-Regular";
  font-size: 15px;
  color: #757575;
  display: inline-block;
  padding: 0 0 0 35px;
  margin-bottom: 10px;
  position: relative;
  cursor: pointer;
  margin-top: 5px;
  margin-right: 20px;
  line-height: 16px;
}
.checkbox label:before {
  width: 23px;
  height: 23px;
  content: "";
  position: absolute;
  top: -6px;
  left: 0;
  border: 1px solid #d8d8d8;
  background: #fff;
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  border-radius: 1px;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -ms-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
  -webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.06);
  -moz-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.06);
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.06);
}
.checkbox label:after {
  width: 14px;
  height: 7px;
  content: "";
  position: absolute;
  top: 0px;
  left: 5px;
  border: 3px solid transparent;
  border-top: none;
  border-right: none;
  background: transparent;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
.checkbox label:hover:before {
  border: 1px solid #707070;
}
.checkbox label span {
  position: absolute;
  right: 0;
  top: 2px;
  font-size: 12px;
  color: #b8bcca;
  text-align: right;
}
.checkbox input {
  visibility: hidden;
  position: absolute;
}
.checkbox input:checked + label {
  color: #757575 !important;
}
.checkbox input:checked + label:before {
  border: 1px solid #c9a84c;
  background: #c9a84c;
}
.checkbox input:checked + label:after {
  border-left: 3px solid #fff;
  border-bottom: 3px solid #fff;
  border-top: 0 solid transparent;
  border-right: 0 solid transparent;
}
.checkbox.checkbox-right label {
  padding: 0 60px 0 15px;
}
.checkbox.checkbox-right label:before {
  top: -10px;
  left: initial;
  right: 0;
}
.checkbox.checkbox-right label:after {
  top: 1px;
  left: initial;
  right: 10px;
}
.checkbox.checkbox-small label {
  padding: 0 0 0 45px;
}
.checkbox.checkbox-small label:before {
  width: 26px;
  height: 26px;
  margin-top: 5px;
  background: #fff;
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  border-radius: 1px;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -ms-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
  -webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.06);
  -moz-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.06);
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.06);
}
.checkbox.checkbox-small label:after {
  width: 16px;
  height: 10px;
  content: "";
  position: absolute;
  top: 1px;
  left: 6px;
  border: 3px solid transparent;
  background: transparent;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
}

.checkbox-holder {
  margin-top: 30px;
}
.checkbox-holder .checkbox {
  display: inline-block;
}
.checkbox-holder .checkbox:last-child {
  margin-left: 40px;
}
@media only screen and (max-width: 767px) {
  .checkbox-holder .checkbox {
    display: block;
  }
  .checkbox-holder .checkbox:last-child {
    margin-left: 0;
  }
}

.radio-set {
  display: inline-block;
  line-height: inherit;
  margin: 0;
  padding: 0;
  margin-right: 15px;
}
.radio-set label {
  font-family: "Roboto-Regular";
  display: inline-block;
  position: relative;
  cursor: pointer;
  font-size: 16px;
  line-height: 20px;
  color: #000;
}
.radio-set label span {
  margin-left: 30px;
  line-height: 20px;
  display: block;
  text-align: left;
  font-size: 16px;
  color: #000;
}
.radio-set label:before {
  position: absolute;
  content: "";
  width: 20px;
  height: 20px;
  text-align: center;
  padding: 0;
  margin: 0;
  background-color: transparent;
  margin-left: -3px;
  border: 2px solid #000;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
.radio-set label:after {
  position: absolute;
  content: "";
  top: 5px;
  left: 2px;
  width: 10px;
  height: 10px;
  background-color: transparent;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
.radio-set input {
  visibility: hidden;
  height: 0;
}
.radio-set input:checked + label:after {
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
  background: #000;
  border: 2px solid #000;
  color: #000;
}
.radio-set input:checked + label:hover:after {
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
  background: #000;
  border: 2px solid #000;
  color: #000;
}

.site-header {
  position: relative;
  z-index: 10;
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 20px 9px;
  filter: drop-shadow(0 6px 10px rgba(0, 0, 0, 0.6));
}
.site-header .site-header-stone {
  position: absolute;
  inset: 0;
  z-index: -1;
  display: flex;
  overflow: hidden;
  pointer-events: none;
}
.site-header .site-header-stone i {
  flex: 1 0 939px;
  background: url("/img/dizajn1/head-mid.webp") center/100% 100% no-repeat;
}
.site-header .site-header-stone i:nth-child(even) {
  transform: scaleX(-1);
}
.site-header .site-header-stone i + i {
  margin-left: -1px;
}
.site-header .site-header-stone:after {
  content: "";
  position: absolute;
  inset: 0 0 9px;
  background: rgba(0, 0, 0, 0.35);
}
.site-header .site-logo {
  position: absolute;
  top: 45.5px;
  left: 4%;
  transform: translateY(-50%);
  display: block;
  -webkit-transition: opacity 0.2s ease;
  -moz-transition: opacity 0.2s ease;
  -ms-transition: opacity 0.2s ease;
  -o-transition: opacity 0.2s ease;
  transition: opacity 0.2s ease;
}
.site-header .site-logo img {
  display: block;
  height: clamp(26px, 3.6vw, 44px);
  width: auto;
}
.site-header .site-logo:hover {
  opacity: 0.85;
}
@media only screen and (max-width: 767px) {
  .site-header .site-logo {
    z-index: 60;
  }
  .site-header .site-logo img {
    height: 30px;
  }
}
.site-header .lang-wrap {
  top: 0;
  bottom: 9px;
  right: 4%;
  height: fit-content;
  margin: auto 0;
  display: flex;
  align-items: center;
  gap: 10px;
}
@media only screen and (max-width: 767px) {
  .site-header .lang-wrap {
    display: none;
  }
}
.site-header .nav-burger {
  display: none;
  position: absolute;
  top: 0;
  bottom: 9px;
  right: 4%;
  margin: auto 0;
  width: 28px;
  height: 20px;
  z-index: 60;
}
.site-header .nav-burger span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  background: #c9a84c;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
  transition: transform 0.3s ease, opacity 0.2s ease, top 0.3s ease;
}
.site-header .nav-burger span:nth-child(1) {
  top: 0;
}
.site-header .nav-burger span:nth-child(2) {
  top: 9px;
}
.site-header .nav-burger span:nth-child(3) {
  top: 18px;
}
.site-header .nav-burger.is-open span:nth-child(1) {
  top: 9px;
  transform: rotate(45deg);
}
.site-header .nav-burger.is-open span:nth-child(2) {
  opacity: 0;
}
.site-header .nav-burger.is-open span:nth-child(3) {
  top: 9px;
  transform: rotate(-45deg);
}
@media only screen and (max-width: 767px) {
  .site-header .nav-burger {
    display: block;
  }
}

@media only screen and (max-width: 767px) {
  .site-header {
    height: 72px;
    padding-bottom: 7px;
  }
  .site-header .site-header-stone i {
    flex-basis: 676.08px;
  }
  .site-header .site-header-stone:after {
    bottom: 7px;
  }
  .site-header .site-logo {
    top: 32.5px;
  }
  .site-header .nav-burger {
    bottom: 7px;
  }
}
.main-nav {
  position: relative;
  display: flex;
  align-items: center;
  gap: clamp(14px, 3.5vw, 56px);
}

.main-nav-item {
  position: static;
}

.main-nav-link {
  position: relative;
  display: block;
  padding: 10px 0;
  font-family: "AlegreyaSC-Bold";
  font-size: clamp(15px, 1.65vw, 25px);
  letter-spacing: 0.04em;
  line-height: 1;
  color: #e2c48e;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.9);
  -webkit-transition: color 0.2s ease;
  -moz-transition: color 0.2s ease;
  -ms-transition: color 0.2s ease;
  -o-transition: color 0.2s ease;
  transition: color 0.2s ease;
}
.main-nav-link:after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 7px;
  height: 7px;
  background: #c9a84c;
  box-shadow: 0 0 8px rgba(201, 168, 76, 0.8);
  opacity: 0;
  transform: translateX(-50%) rotate(45deg) scale(0.4);
  -webkit-transition: all 0.25s ease;
  -moz-transition: all 0.25s ease;
  -ms-transition: all 0.25s ease;
  -o-transition: all 0.25s ease;
  transition: all 0.25s ease;
}

.main-nav-item.is-current .main-nav-link {
  color: #c9a84c;
}
@media only screen and (min-width: 768px) {
  .main-nav-item.is-current .main-nav-link:after {
    opacity: 1;
    transform: translateX(-50%) rotate(45deg) scale(1);
  }
}

.mega-menu-item.is-current {
  border-color: rgba(201, 168, 76, 0.4);
}
.mega-menu-item.is-current strong {
  color: #c9a84c;
}

.lang-flag {
  position: relative;
  display: block;
  width: 32px;
  height: 32px;
  padding: 2px;
  border: 1px solid rgba(203, 180, 136, 0.45);
  background: rgba(0, 0, 0, 0.5);
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.7);
  transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}
.lang-flag svg {
  display: block;
  width: 100%;
  height: 100%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  filter: sepia(0.1) saturate(0.95);
}
.lang-flag:after {
  content: "";
  position: absolute;
  inset: 2px;
  background: radial-gradient(circle at 32% 26%, rgba(255, 240, 200, 0.28), rgba(255, 240, 200, 0) 45%, rgba(0, 0, 0, 0.3) 100%);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.6);
  pointer-events: none;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
}
.lang-flag:hover {
  border-color: rgba(201, 168, 76, 0.8);
  transform: translateY(-1px);
}
.lang-flag.is-active {
  border-color: #c9a84c;
  box-shadow: 0 0 8px rgba(201, 168, 76, 0.45), 0 2px 5px rgba(0, 0, 0, 0.7);
}
@media only screen and (max-width: 767px) {
  .lang-flag {
    width: 26px;
    height: 26px;
    padding: 1px;
  }
  .lang-flag:after {
    inset: 1px;
  }
}

/* ========== Mega menu ========== */
.mega-menu {
  position: absolute;
  top: 100%;
  left: 50%;
  z-index: 20;
  width: 640px;
  padding-top: 30px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate(-50%, 12px) scale(0.97);
  transform-origin: 50% 0;
  transition: opacity 0.28s ease, transform 0.35s cubic-bezier(0.2, 0.8, 0.3, 1), visibility 0s linear 0.35s;
}

.mega-menu-inner {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  padding: 18px;
  background: #1b140e url("/img/background-tile.webp") repeat center;
  border: 1px solid rgba(201, 168, 76, 0.55);
  box-shadow: inset 0 0 0 5px rgba(0, 0, 0, 0.35), inset 0 0 0 6px rgba(201, 168, 76, 0.22), 0 22px 45px rgba(0, 0, 0, 0.75);
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
.mega-menu-inner:before {
  content: "";
  position: absolute;
  top: -1px;
  left: 18px;
  right: 18px;
  height: 2px;
  background: linear-gradient(to right, transparent, #c9a84c, transparent);
}

.mega-menu-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px;
  border: 1px solid transparent;
  background: rgba(0, 0, 0, 0.25);
  opacity: 0;
  transform: translateY(6px);
  transition: opacity 0.3s ease, transform 0.3s ease, background-color 0.2s ease, border-color 0.2s ease;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
.mega-menu-item img {
  flex: none;
  width: 46px;
  height: 46px;
  object-fit: cover;
  border: 1px solid rgba(201, 168, 76, 0.6);
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -webkit-transition: transform 0.3s ease;
  -moz-transition: transform 0.3s ease;
  -ms-transition: transform 0.3s ease;
  -o-transition: transform 0.3s ease;
  transition: transform 0.3s ease;
}
.mega-menu-item span {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.mega-menu-item strong {
  font-family: "AlegreyaSC-Bold";
  font-size: 16px;
  line-height: 1.1;
  letter-spacing: 0.03em;
  color: #f1e3c6;
  -webkit-transition: color 0.2s ease;
  -moz-transition: color 0.2s ease;
  -ms-transition: color 0.2s ease;
  -o-transition: color 0.2s ease;
  transition: color 0.2s ease;
}
.mega-menu-item small {
  font-family: "Roboto-Light";
  font-size: 12px;
  line-height: 1.3;
  color: #b3a48f;
}
.mega-menu-item:hover {
  background: rgba(201, 168, 76, 0.1);
  border-color: rgba(201, 168, 76, 0.4);
}
.mega-menu-item:hover img {
  transform: scale(1.08);
}
.mega-menu-item:hover strong {
  color: #c9a84c;
}

@media only screen and (min-width: 1024px) {
  .main-nav-item:hover .main-nav-link,
  .main-nav-item:focus-within .main-nav-link {
    color: #c9a84c;
  }
  .main-nav-item:hover .main-nav-link:after,
  .main-nav-item:focus-within .main-nav-link:after {
    opacity: 1;
    transform: translateX(-50%) rotate(45deg) scale(1);
  }
  .main-nav-item:hover .mega-menu,
  .main-nav-item:focus-within .mega-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translate(-50%, 0) scale(1);
    transition: opacity 0.28s ease, transform 0.35s cubic-bezier(0.2, 0.8, 0.3, 1), visibility 0s;
  }
  .main-nav-item:hover .mega-menu-item,
  .main-nav-item:focus-within .mega-menu-item {
    opacity: 1;
    transform: none;
  }
  .main-nav-item:hover .mega-menu-item:nth-child(1),
  .main-nav-item:focus-within .mega-menu-item:nth-child(1) {
    transition: opacity 0.3s ease 0.075s, transform 0.3s ease 0.075s, background-color 0.2s ease, border-color 0.2s ease;
  }
  .main-nav-item:hover .mega-menu-item:nth-child(2),
  .main-nav-item:focus-within .mega-menu-item:nth-child(2) {
    transition: opacity 0.3s ease 0.11s, transform 0.3s ease 0.11s, background-color 0.2s ease, border-color 0.2s ease;
  }
  .main-nav-item:hover .mega-menu-item:nth-child(3),
  .main-nav-item:focus-within .mega-menu-item:nth-child(3) {
    transition: opacity 0.3s ease 0.145s, transform 0.3s ease 0.145s, background-color 0.2s ease, border-color 0.2s ease;
  }
  .main-nav-item:hover .mega-menu-item:nth-child(4),
  .main-nav-item:focus-within .mega-menu-item:nth-child(4) {
    transition: opacity 0.3s ease 0.18s, transform 0.3s ease 0.18s, background-color 0.2s ease, border-color 0.2s ease;
  }
  .main-nav-item:hover .mega-menu-item:nth-child(5),
  .main-nav-item:focus-within .mega-menu-item:nth-child(5) {
    transition: opacity 0.3s ease 0.215s, transform 0.3s ease 0.215s, background-color 0.2s ease, border-color 0.2s ease;
  }
  .main-nav-item:hover .mega-menu-item:nth-child(6),
  .main-nav-item:focus-within .mega-menu-item:nth-child(6) {
    transition: opacity 0.3s ease 0.25s, transform 0.3s ease 0.25s, background-color 0.2s ease, border-color 0.2s ease;
  }
  .main-nav-item:hover .mega-menu-item:nth-child(7),
  .main-nav-item:focus-within .mega-menu-item:nth-child(7) {
    transition: opacity 0.3s ease 0.285s, transform 0.3s ease 0.285s, background-color 0.2s ease, border-color 0.2s ease;
  }
  .main-nav-item:hover .mega-menu-item:nth-child(8),
  .main-nav-item:focus-within .mega-menu-item:nth-child(8) {
    transition: opacity 0.3s ease 0.32s, transform 0.3s ease 0.32s, background-color 0.2s ease, border-color 0.2s ease;
  }
}
.main-nav-lang {
  display: none;
}

/* ========== Mobile nav: full-screen takeover ========== */
@media only screen and (max-width: 767px) {
  body.nav-open {
    overflow: hidden;
  }
  body.nav-open .site-header {
    filter: none;
  }
  .main-nav {
    position: fixed;
    inset: 0;
    z-index: 55;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 84px 7% 36px;
    overflow-y: auto;
    overscroll-behavior: contain;
    background: #1b140e url("/img/background-tile.webp") repeat center;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.3s ease, visibility 0s linear 0.3s;
  }
  .main-nav.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: opacity 0.3s ease, visibility 0s;
  }
  .main-nav > :first-child {
    margin-top: auto;
  }
  .main-nav > :last-child {
    margin-bottom: auto;
  }
  .main-nav:before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1;
    height: 74px;
    background: linear-gradient(to bottom, #17110c 55%, rgba(23, 17, 12, 0));
    pointer-events: none;
  }
  .main-nav-item {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity 0.4s ease, transform 0.4s ease;
    border-bottom: 1px solid rgba(201, 168, 76, 0.25);
  }
  .main-nav-item:first-child {
    border-top: 1px solid rgba(201, 168, 76, 0.25);
  }
  .main-nav.is-open .main-nav-item {
    opacity: 1;
    transform: none;
  }
  .main-nav.is-open .main-nav-item:nth-child(1) {
    transition-delay: 0.17s;
  }
  .main-nav.is-open .main-nav-item:nth-child(2) {
    transition-delay: 0.24s;
  }
  .main-nav.is-open .main-nav-item:nth-child(3) {
    transition-delay: 0.31s;
  }
  .main-nav.is-open .main-nav-item:nth-child(4) {
    transition-delay: 0.38s;
  }
  .main-nav-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 4px;
    font-size: 26px;
  }
  .main-nav-link:after {
    position: static;
    flex: none;
    width: 10px;
    height: 10px;
    margin-right: 6px;
    background: none;
    border-right: 2px solid #c9a84c;
    border-bottom: 2px solid #c9a84c;
    box-shadow: none;
    opacity: 0.85;
    transform: translateY(-3px) rotate(45deg);
    transition: transform 0.3s ease;
  }
  .main-nav-item.is-expanded .main-nav-link {
    color: #c9a84c;
  }
  .main-nav-item.is-expanded .main-nav-link:after {
    transform: translateY(3px) rotate(-135deg);
  }
  .mega-menu {
    position: static;
    display: grid;
    grid-template-rows: 0fr;
    width: auto;
    padding: 0;
    opacity: 1;
    visibility: hidden;
    pointer-events: auto;
    transform: none;
    transition: grid-template-rows 0.35s ease, visibility 0s linear 0.35s;
  }
  .main-nav-item.is-expanded .mega-menu {
    grid-template-rows: 1fr;
    visibility: visible;
    transition: grid-template-rows 0.35s ease, visibility 0s;
  }
  .mega-menu-inner {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-height: 0;
    overflow: hidden;
    padding: 0;
    background: none;
    border: 0;
    box-shadow: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
  }
  .mega-menu-inner:before {
    display: none;
  }
  .mega-menu-item {
    padding: 9px 6px;
    background: none;
  }
  .mega-menu-item:first-child {
    margin-top: 2px;
  }
  .mega-menu-item:last-child {
    margin-bottom: 16px;
  }
  .mega-menu-item img {
    width: 42px;
    height: 42px;
  }
  .mega-menu-item strong {
    font-size: 17px;
  }
  .mega-menu-item small {
    font-size: 13px;
  }
  .main-nav-item.is-expanded .mega-menu-item {
    opacity: 1;
    transform: none;
  }
  .main-nav-item.is-expanded .mega-menu-item:nth-child(1) {
    transition-delay: 0.1s;
  }
  .main-nav-item.is-expanded .mega-menu-item:nth-child(2) {
    transition-delay: 0.14s;
  }
  .main-nav-item.is-expanded .mega-menu-item:nth-child(3) {
    transition-delay: 0.18s;
  }
  .main-nav-item.is-expanded .mega-menu-item:nth-child(4) {
    transition-delay: 0.22s;
  }
  .main-nav-item.is-expanded .mega-menu-item:nth-child(5) {
    transition-delay: 0.26s;
  }
  .main-nav-item.is-expanded .mega-menu-item:nth-child(6) {
    transition-delay: 0.3s;
  }
  .main-nav-item.is-expanded .mega-menu-item:nth-child(7) {
    transition-delay: 0.34s;
  }
  .main-nav-item.is-expanded .mega-menu-item:nth-child(8) {
    transition-delay: 0.38s;
  }
  .main-nav-lang {
    display: flex;
    justify-content: center;
    gap: 14px;
    margin-top: 34px;
    opacity: 0;
    transition: opacity 0.4s ease;
  }
  .main-nav-lang a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 16px 7px 7px;
    font-family: "AlegreyaSC-Bold";
    font-size: 17px;
    letter-spacing: 0.03em;
    color: #cbb488;
    border: 1px solid rgba(201, 168, 76, 0.3);
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    transition: color 0.2s ease, border-color 0.2s ease;
  }
  .main-nav-lang a.is-active {
    color: #c9a84c;
    border-color: rgba(201, 168, 76, 0.75);
  }
  .main-nav-lang .lang-flag {
    width: 30px;
    height: 30px;
  }
  .main-nav.is-open .main-nav-lang {
    opacity: 1;
    transition-delay: 0.45s;
  }
}
/* ========== Hero ========== */
.hero {
  position: relative;
  overflow: hidden;
  height: calc(100vh - 100px);
  min-height: 420px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hero:after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0.45) 100%), linear-gradient(to bottom, rgba(0, 0, 0, 0) 70%, #21201e 100%);
  pointer-events: none;
}
@media only screen and (max-width: 767px) {
  .hero {
    height: 70vh;
  }
}

.hero-bg {
  position: absolute;
  left: 0;
  right: 0;
  top: -15%;
  width: 100%;
  height: 130%;
  object-fit: cover;
  will-change: transform;
}

.hero-content {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 760px;
  padding: 0 20px;
}
.hero-content img {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 6px 14px rgba(0, 0, 0, 0.8));
}

.site-footer {
  position: relative;
  z-index: 2;
  height: calc(max(170px, 21.65vw) * 0.699);
  background: #14100c;
}
.site-footer:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: max(170px, 21.65vw);
  background: url("/img/dizajn1/footer-wall.webp") 49% bottom/auto 100% no-repeat;
  filter: brightness(0.8) drop-shadow(0 -3px 8px rgba(0, 0, 0, 0.5));
  pointer-events: none;
}

.footer-wrap {
  position: relative;
  height: 100%;
  padding: 0 20px;
}

.footer-top {
  position: absolute;
  top: calc(68.7% - 28px);
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  gap: 36px;
  white-space: nowrap;
}
@media only screen and (max-width: 767px) {
  .footer-top {
    gap: 20px;
  }
}

.footer-nav {
  display: flex;
  gap: 28px;
}
@media only screen and (max-width: 767px) {
  .footer-nav {
    gap: 16px;
  }
}
.footer-nav a {
  font-family: "AlegreyaSC-BoldItalic";
  font-size: 24px;
  line-height: 1;
  color: #e2c48e;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
}
.footer-nav a:hover {
  color: #c9a84c;
}
@media only screen and (max-width: 767px) {
  .footer-nav a {
    font-size: 20px;
  }
}

.footer-social {
  display: flex;
  gap: 8px;
}
.footer-social a {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: #e2c48e;
  background-color: rgba(18, 12, 7, 0.85);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.6);
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  border-radius: 7px;
}
.footer-social a:hover {
  color: #1b140e;
  background-color: #c9a84c;
}
@media only screen and (max-width: 767px) {
  .footer-social a {
    width: 32px;
    height: 32px;
    font-size: 16px;
  }
}

.footer-copy {
  position: absolute;
  bottom: 15px;
  left: 50%;
  width: max-content;
  transform: translateX(-50%);
  text-align: center;
  font-family: "Roboto-Light";
  font-size: 13px;
  line-height: 1.3;
  letter-spacing: 0.03em;
  color: #d9c4a0;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
}
@media only screen and (max-width: 767px) {
  .footer-copy {
    font-size: 12px;
  }
}

.to-top {
  position: absolute;
  top: calc(max(170px, 21.65vw) * 0.006);
  left: 49%;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  color: #e2c48e;
  background: #1b140e url("/img/background-tile.webp") repeat center;
  border: 1px solid rgba(201, 168, 76, 0.7);
  box-shadow: inset 0 0 0 4px rgba(0, 0, 0, 0.4), inset 0 0 0 5px rgba(201, 168, 76, 0.28), 0 6px 14px rgba(0, 0, 0, 0.7);
  transform: translate(-50%, -50%);
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  transition: transform 0.3s ease, color 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}
.to-top svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.8));
  transition: transform 0.3s ease;
}
.to-top:hover, .to-top:focus-visible {
  color: #c9a84c;
  border-color: #c9a84c;
  box-shadow: inset 0 0 0 4px rgba(0, 0, 0, 0.4), inset 0 0 0 5px rgba(201, 168, 76, 0.45), 0 0 14px rgba(201, 168, 76, 0.45), 0 6px 14px rgba(0, 0, 0, 0.7);
  transform: translate(-50%, calc(-50% - 3px));
  outline: none;
}
.to-top:hover svg, .to-top:focus-visible svg {
  transform: translateY(-2px);
}
@media only screen and (max-width: 767px) {
  .to-top {
    width: 44px;
    height: 44px;
  }
  .to-top svg {
    width: 19px;
    height: 19px;
  }
}

/* ========== Author popup (fancyBox 3 inline content) ========== */
.author-popup {
  position: relative;
  width: 100%;
  max-width: 720px;
  text-align: left;
}
.author-popup.fancybox-content {
  overflow: hidden;
  padding: 48px 54px 48px 300px;
  color: #e3d3b4;
  background: #1b140e url("/img/background-tile.webp") repeat center;
  border: 1px solid rgba(201, 168, 76, 0.55);
  box-shadow: inset 0 0 0 6px rgba(0, 0, 0, 0.35), inset 0 0 0 7px rgba(201, 168, 76, 0.25), 0 20px 50px rgba(0, 0, 0, 0.7);
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  animation: authorCardIn 0.6s cubic-bezier(0.2, 0.8, 0.3, 1) both;
}
@media only screen and (max-width: 767px) {
  .author-popup.fancybox-content {
    padding: 0 22px 30px;
    text-align: center;
  }
}
.author-popup-info {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  min-height: 284px;
}
@media only screen and (max-width: 767px) {
  .author-popup-info {
    align-items: center;
    min-height: 0;
  }
}
.author-popup-info > * {
  animation: authorLineIn 0.5s ease-out both;
}
.author-popup-info > :nth-child(1) {
  animation-delay: 0.39s;
}
.author-popup-info > :nth-child(2) {
  animation-delay: 0.48s;
}
.author-popup-info > :nth-child(3) {
  animation-delay: 0.57s;
}
.author-popup-info > :nth-child(4) {
  animation-delay: 0.66s;
}
.author-popup h2 {
  font-family: "AlegreyaSC-Bold";
  font-size: 32px;
  line-height: 1.15;
  letter-spacing: 0.03em;
  color: #f1e3c6;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.8);
  margin-bottom: 18px;
}
@media only screen and (max-width: 767px) {
  .author-popup h2 {
    font-size: 26px;
    margin-bottom: 14px;
  }
}
.author-popup p {
  font-family: "Roboto-Light";
  font-size: 15px;
  line-height: 1.7;
  margin-bottom: 12px;
}
.author-popup p:last-child {
  margin-bottom: 0;
}
.author-popup-photo {
  position: absolute;
  left: 0;
  top: 16px;
  bottom: 0;
  pointer-events: none;
  animation: authorFigureIn 0.9s cubic-bezier(0.2, 0.8, 0.3, 1) 0.15s both;
}
@media only screen and (max-width: 767px) {
  .author-popup-photo {
    position: relative;
    top: auto;
    width: 200px;
    margin: 10px auto -30px;
    animation-name: authorFigureInPhone;
  }
}
.author-popup-img {
  display: block;
  width: auto;
  height: 100%;
}
@media only screen and (max-width: 767px) {
  .author-popup-img {
    width: 100%;
    height: auto;
  }
}
.author-popup-name {
  font-family: "AlegreyaSC-Bold";
  font-size: 20px;
  letter-spacing: 0.04em;
  color: #c9a84c;
  margin-bottom: 6px;
}
.author-popup p.author-popup-role {
  font-family: "Roboto-Light";
  font-size: 14px;
  font-style: italic;
  color: #b3a48f;
  margin-bottom: 20px;
}
.author-popup-btns {
  display: inline-flex;
  flex-direction: column;
  gap: 12px;
}
.author-popup .author-popup-btn {
  position: relative;
  display: block;
  padding: 15px 24px 15px 72px;
  text-align: center;
  white-space: nowrap;
}
.author-popup .author-popup-btn .icon {
  position: absolute;
  left: 4px;
  top: 4px;
  bottom: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  font-size: 16px;
  color: #c9a84c;
  background: rgba(0, 0, 0, 0.22);
  border-right: 1px solid rgba(201, 168, 76, 0.45);
  transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}
.author-popup .author-popup-btn:hover .icon {
  color: #1b140e;
  background: rgba(27, 20, 14, 0.1);
  border-right-color: rgba(27, 20, 14, 0.4);
}
.author-popup .fancybox-close-small {
  color: #c9a84c;
  opacity: 0.9;
}
.author-popup .fancybox-close-small:hover {
  color: #f1e3c6;
}

@keyframes authorCardIn {
  from {
    opacity: 0;
    transform: translateY(28px) scale(0.96);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes authorFigureIn {
  from {
    opacity: 0;
    transform: translateX(-46px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes authorFigureInPhone {
  from {
    opacity: 0;
    transform: translateY(-18px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes authorLineIn {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .author-popup.fancybox-content,
  .author-popup-photo,
  .author-popup-info > * {
    animation: none;
  }
}
.fancybox-bg {
  background: #0b0805;
}

.fancybox-is-open .fancybox-bg {
  opacity: 0.85;
}

/* ========== Regions tabs ========== */
.regions {
  position: relative;
  z-index: 2;
  padding: 0 0 70px;
}
@media only screen and (max-width: 767px) {
  .regions {
    padding: 0 0 60px;
  }
}

.tabs-nav {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: center;
  gap: 0 clamp(10px, 4vw, 70px);
  min-height: max(84px, 6.33vw);
  padding: 0 3%;
  margin: 0 0 44px;
  background: #1b140e;
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.6);
}
.tabs-nav-item {
  position: relative;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 0 10px 6px;
  color: #cbb488;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.9);
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
.tabs-nav-item:after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 13%;
  width: 0;
  height: 2px;
  background: #c9a84c;
  box-shadow: 0 0 8px rgba(201, 168, 76, 0.7);
  transform: translateX(-50%);
  -webkit-transition: width 0.25s ease;
  -moz-transition: width 0.25s ease;
  -ms-transition: width 0.25s ease;
  -o-transition: width 0.25s ease;
  transition: width 0.25s ease;
}
.tabs-nav-item:hover {
  color: #f1e3c6;
}
.tabs-nav-item.is-active {
  color: #c9a84c;
}
.tabs-nav-item.is-active:after {
  width: 100%;
}
.tabs-nav-item.is-active .tabs-nav-icon {
  border-color: #c9a84c;
  box-shadow: 0 0 10px rgba(201, 168, 76, 0.45);
}
.tabs-nav-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(203, 180, 136, 0.35);
  background: rgba(0, 0, 0, 0.4);
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
.tabs-nav-icon svg {
  width: 22px;
  height: 22px;
}
.tabs-nav-item[data-tab-target=andi] .tabs-nav-icon {
  width: 48px;
  height: 48px;
}
.tabs-nav-item[data-tab-target=andi] .tabs-nav-icon svg {
  width: 30px;
  height: 30px;
}
.tabs-nav-label {
  font-family: "AlegreyaSC-Bold";
  font-size: 22px;
  letter-spacing: 0.05em;
  line-height: 1;
}
@media only screen and (max-width: 767px) {
  .tabs-nav {
    gap: 0;
    padding: 0;
  }
  .tabs-nav-item {
    flex: 1 1 25%;
    flex-direction: column;
    gap: 6px;
    padding: 14px 2px 12px;
  }
  .tabs-nav-icon {
    width: 32px;
    height: 32px;
  }
  .tabs-nav-icon svg {
    width: 17px;
    height: 17px;
  }
  .tabs-nav-item[data-tab-target=andi] .tabs-nav-icon {
    width: 36px;
    height: 36px;
  }
  .tabs-nav-item[data-tab-target=andi] .tabs-nav-icon svg {
    width: 22px;
    height: 22px;
  }
  .tabs-nav-label {
    font-size: 13px;
    letter-spacing: 0.02em;
  }
}

/* ========== Regions tabs: relief variant (.tabs-nav--relief) ========== */
.tabs-nav--relief {
  gap: 0;
}
.tabs-nav--relief .tabs-nav-item {
  flex-direction: column;
  justify-content: center;
  gap: clamp(6px, 0.7vw, 12px);
  color: #c2a467;
}
.tabs-nav--relief .tabs-nav-item:after {
  bottom: 4px;
  height: 3px;
}
.tabs-nav--relief .tabs-nav-item:hover {
  color: #f1e3c6;
}
.tabs-nav--relief .tabs-nav-item.is-active {
  color: #c9a84c;
  background: radial-gradient(ellipse 60% 70% at 50% 55%, rgba(201, 168, 76, 0.15), rgba(201, 168, 76, 0) 70%);
}
.tabs-nav--relief .tabs-nav-item.is-active:after {
  width: 56%;
}
.tabs-nav--relief .tabs-nav-item .tabs-nav-icon {
  width: clamp(40px, 4.8vw, 76px);
  height: clamp(40px, 4.8vw, 76px);
  border: 0;
  background: currentColor;
  box-shadow: none;
  -webkit-mask: var(--icon) center/contain no-repeat;
  mask: var(--icon) center/contain no-repeat;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}
.tabs-nav--relief .tabs-nav-item .tabs-nav-icon svg {
  display: none;
}
.tabs-nav--relief .tabs-nav-item[data-tab-target=andi] {
  --icon: url('/img/dizajn1/tabs-icon-andes.svg');
}
.tabs-nav--relief .tabs-nav-item[data-tab-target=antili] {
  --icon: url('/img/dizajn1/tabs-icon-antilles.svg');
}
.tabs-nav--relief .tabs-nav-item[data-tab-target=mezoamerika] {
  --icon: url('/img/dizajn1/tabs-icon-mesoamerica.svg');
}
.tabs-nav--relief .tabs-nav-item[data-tab-target=amazonija] {
  --icon: url('/img/dizajn1/tabs-icon-amazonia.svg');
}
.tabs-nav--relief .tabs-nav-item[data-tab-target=andes] {
  --icon: url('/img/dizajn1/tabs-icon-andes.svg');
}
.tabs-nav--relief .tabs-nav-item[data-tab-target=antilles] {
  --icon: url('/img/dizajn1/tabs-icon-antilles.svg');
}
.tabs-nav--relief .tabs-nav-item[data-tab-target=mesoamerica] {
  --icon: url('/img/dizajn1/tabs-icon-mesoamerica.svg');
}
.tabs-nav--relief .tabs-nav-item[data-tab-target=amazonia] {
  --icon: url('/img/dizajn1/tabs-icon-amazonia.svg');
}
.tabs-nav--relief .tabs-nav-label {
  font-size: clamp(15px, 1.5vw, 23px);
}
@media only screen and (min-width: 768px) {
  .tabs-nav--relief {
    flex-wrap: nowrap;
    aspect-ratio: 2170/477;
    min-height: 0;
    margin-top: -9.447%;
    padding: 10.5991% 9.3548% 1.4286% 11.6129%;
    background: url("/img/dizajn1/tabs-bar-v2.webp") center top/100% 100% no-repeat;
    box-shadow: none;
  }
  .tabs-nav--relief:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 42.977%;
    bottom: 0;
    z-index: -1;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.6);
    pointer-events: none;
  }
  .tabs-nav--relief .tabs-nav-item {
    padding: 0 8px;
  }
  .tabs-nav--relief .tabs-nav-item:nth-child(1) {
    flex: 0 1 25.1603%;
  }
  .tabs-nav--relief .tabs-nav-item:nth-child(2) {
    flex: 0 1 26.6472%;
  }
  .tabs-nav--relief .tabs-nav-item:nth-child(3) {
    flex: 0 1 24.6647%;
  }
  .tabs-nav--relief .tabs-nav-item:nth-child(4) {
    flex: 0 1 23.5277%;
  }
}
@media only screen and (max-width: 767px) {
  .tabs-nav--relief {
    --band: 104px;
    min-height: var(--band);
    padding: 0;
    background: #14100c url("/img/dizajn1/head-mid.webp") center bottom/auto var(--band) repeat-x;
  }
  .tabs-nav--relief:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: calc(var(--band) * 0.09);
    background: url("/img/dizajn1/head-mid.webp") center bottom/auto var(--band) repeat-x;
    transform: scaleY(-1);
    pointer-events: none;
  }
  .tabs-nav--relief .tabs-nav-item {
    flex: 1 1 0;
    gap: 6px;
    padding: 14px 2px;
  }
  .tabs-nav--relief .tabs-nav-item:after {
    bottom: 12px;
    height: 2px;
  }
  .tabs-nav--relief .tabs-nav-item + .tabs-nav-item:before {
    content: "";
    position: absolute;
    left: -4px;
    top: 24%;
    bottom: 24%;
    width: 9px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 9'%3E%3Cpath d='M4.5 0 9 4.5 4.5 9 0 4.5z' fill='%23c9a84c'/%3E%3C/svg%3E") center/7px 7px no-repeat, linear-gradient(to bottom, rgba(201, 168, 76, 0), rgba(201, 168, 76, 0.5) 30%, rgba(201, 168, 76, 0.5) 70%, rgba(201, 168, 76, 0)) center/1px 100% no-repeat;
    pointer-events: none;
  }
  .tabs-nav--relief .tabs-nav-item .tabs-nav-icon {
    width: 34px;
    height: 34px;
  }
  .tabs-nav--relief .tabs-nav-label {
    font-size: 13px;
  }
}
@media only screen and (max-width: 767px) and (max-width: 479px) {
  .tabs-nav--relief .tabs-nav-label {
    font-size: 12px;
  }
}

.tabs-panels {
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 4%;
}
@media only screen and (max-width: 767px) {
  .tabs-panels {
    padding: 0 5%;
  }
}

.tabs-panel {
  display: none;
}
.tabs-panel.is-active {
  display: block;
  animation: tabFade 0.35s ease;
}

@keyframes tabFade {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.tabs-panel .row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0 -8px;
}
.tabs-panel .row > .column {
  padding: 0 8px 16px;
}

/* ========== Region tile ========== */
.region-tile {
  position: relative;
  display: block;
  aspect-ratio: 1/1;
  filter: drop-shadow(0 8px 14px rgba(0, 0, 0, 0.6));
}
@media only screen and (max-width: 767px) {
  .region-tile {
    aspect-ratio: 4/3;
  }
}
.region-tile-media {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.1);
  clip-path: polygon(0% 0.26%, 2.21% 0.03%, 4.28% 0.3%, 6.14% 0.29%, 8.33% 0.32%, 10.63% 0.45%, 11.98% 0.07%, 13.3% 0.01%, 15.48% 0.53%, 17.36% 0.04%, 19.66% 0.53%, 21.41% 0.28%, 23.31% 0.47%, 25.53% 0.11%, 27.57% 0.44%, 28.86% 0.41%, 30.11% 0.23%, 31.35% 0.02%, 33.36% 0.46%, 34.88% 0.25%, 36.12% 0.32%, 38.25% 0.43%, 39.93% 0.3%, 41.26% 0.28%, 43.1% 0.29%, 44.3% 0.55%, 46.52% 0.05%, 47.81% 0.15%, 49.86% 0.39%, 51.68% 0.54%, 53% 0.11%, 55.36% 0.03%, 57.02% 0.34%, 58.92% 0.15%, 61.26% 0.02%, 63.2% 0.35%, 65.07% 0.26%, 66.56% 0.24%, 67.93% 0.17%, 69.99% 0.08%, 71.45% 0.37%, 72.71% 0.5%, 73.99% 0.04%, 75.28% 0.04%, 76.59% 0.32%, 78.46% 0.27%, 80.27% 0.21%, 81.5% 0.25%, 83.33% 0.52%, 85.02% 0.16%, 86.58% 0.19%, 87.96% 0.23%, 89.99% 0.04%, 91.87% 0.12%, 93.19% 0.25%, 94.97% 0.14%, 96.67% 0.54%, 98.15% 0.62%, 99.88% 0%, 99.83% 1.56%, 99.62% 3.65%, 99.96% 5.75%, 99.75% 7.74%, 99.99% 9.25%, 99.51% 11.17%, 99.9% 13.39%, 99.99% 15.5%, 99.57% 17.55%, 99.49% 19.02%, 99.58% 20.38%, 99.5% 21.63%, 99.57% 23.41%, 99.99% 24.81%, 99.97% 26.74%, 99.94% 29.05%, 99.81% 30.4%, 99.68% 32.31%, 99.86% 34.38%, 99.55% 36.02%, 99.8% 38.01%, 99.74% 40.11%, 99.89% 42.45%, 99.66% 44.37%, 99.99% 46.43%, 99.8% 47.65%, 99.67% 49.36%, 99.88% 51.24%, 99.67% 52.5%, 99.61% 54.17%, 99.79% 56.13%, 99.94% 58.07%, 99.58% 60.02%, 99.82% 62.21%, 99.84% 63.63%, 99.61% 65.06%, 99.82% 66.44%, 100% 68.56%, 99.56% 69.86%, 99.6% 71.51%, 99.54% 73.58%, 99.56% 75.4%, 99.47% 77.05%, 99.77% 78.46%, 99.47% 80.73%, 99.45% 83.07%, 99.76% 84.99%, 99.66% 87.09%, 99.69% 89.28%, 99.46% 90.93%, 99.56% 92.47%, 99.84% 94.06%, 99.95% 96.07%, 99.82% 97.99%, 99.77% 99.53%, 100% 99.79%, 98.5% 99.08%, 96.12% 99.54%, 93.97% 99.54%, 92.41% 99.69%, 90.74% 99.89%, 88.48% 99.86%, 86.48% 99.84%, 84.56% 99.73%, 83.13% 99.56%, 81.03% 99.79%, 78.95% 99.96%, 77.24% 99.57%, 75.01% 99.59%, 72.84% 99.96%, 71.12% 99.58%, 69.5% 99.62%, 67.79% 99.48%, 65.62% 99.86%, 63.67% 99.69%, 61.68% 99.97%, 60.29% 99.52%, 58.7% 99.85%, 57.31% 99.53%, 55.88% 99.48%, 54.44% 99.83%, 53.18% 99.93%, 51.06% 99.68%, 49.19% 99.91%, 47% 99.68%, 45.04% 99.57%, 43.58% 99.39%, 41.78% 99.82%, 39.63% 99.7%, 38.29% 99.95%, 36.43% 99.47%, 34.7% 99.92%, 33.02% 99.96%, 31.53% 99.78%, 29.99% 99.55%, 28.48% 99.49%, 26.3% 99.74%, 24.73% 99.69%, 22.41% 99.94%, 20.02% 99.81%, 18.33% 99.79%, 16.88% 99.7%, 15.07% 99.78%, 13.77% 99.86%, 12.44% 99.45%, 10.35% 99.68%, 8.11% 99.49%, 5.99% 99.95%, 4.21% 99.55%, 1.85% 99.55%, 0.45% 100%, 0.07% 98.5%, 0.3% 97.02%, 0.15% 95.45%, 0.28% 93.72%, 0.06% 91.53%, 0.52% 89.7%, 0.35% 87.78%, 0.18% 86%, 0.18% 83.63%, 0.52% 82.19%, 0.43% 80.12%, 0.11% 78.56%, 0.44% 76.68%, 0.12% 74.49%, 0.49% 72.22%, 0.09% 70.66%, 0.05% 68.58%, 0.02% 66.89%, 0.37% 64.58%, 0.2% 62.61%, 0.05% 60.6%, 0.21% 58.82%, 0.29% 56.64%, 0.58% 55.01%, 0.1% 53.45%, 0.29% 51.8%, 0.17% 50.5%, 0.53% 49.2%, 0.2% 47.2%, 0.35% 45.58%, 0.39% 43.49%, 0.05% 41.57%, 0.41% 39.37%, 0.49% 37.6%, 0.25% 36.39%, 0.23% 35.07%, 0.54% 32.73%, 0.31% 30.76%, 0.3% 28.86%, 1.09% 26.7%, 0.07% 24.77%, 0.43% 23.19%, 0.41% 21.46%, 0.53% 19.91%, 0.46% 17.66%, 0.11% 15.57%, 0.04% 13.48%, 0.38% 11.13%, 0.35% 8.92%, 0.3% 6.73%, 0.26% 4.85%, 0.21% 3.02%, 0.48% 1.5%, 0.36% 0.15%);
}
.region-tile-photo {
  position: absolute;
  inset: 0;
  clip-path: polygon(0.75% 1.65%, 3.05% 1%, 4.66% 1.13%, 6.7% 0.82%, 7.98% 0.75%, 9.84% 1%, 11.31% 1.27%, 12.64% 0.79%, 15.02% 0.9%, 17.02% 0.79%, 18.62% 0.81%, 20.55% 0.94%, 22.37% 1.26%, 24.46% 0.84%, 26.25% 1.22%, 28.53% 0.92%, 30.52% 1.11%, 31.99% 1.24%, 34.36% 1.21%, 35.69% 1.15%, 37.79% 1.1%, 40.16% 1.09%, 41.75% 1.1%, 43.53% 1.04%, 44.9% 1.3%, 46.54% 0.91%, 48.28% 0.93%, 49.49% 1%, 51.85% 0.89%, 53.47% 1.83%, 55.59% 1.24%, 57% 0.83%, 58.85% 0.97%, 61.02% 1.39%, 62.9% 0.84%, 64.65% 0.9%, 67% 1%, 69.05% 0.8%, 71.24% 0.98%, 73.2% 1.15%, 75.34% 1.28%, 76.65% 1.61%, 78.55% 1.28%, 80.04% 1.15%, 82.34% 1.17%, 83.76% 1.02%, 85.3% 1.32%, 86.63% 0.82%, 88.19% 1.22%, 89.52% 0.92%, 90.92% 1.23%, 92.91% 0.89%, 94.41% 1.24%, 95.64% 0.85%, 97.82% 1.24%, 99.05% 0.75%, 98.76% 2.09%, 98.88% 4.26%, 98.6% 6.3%, 98.86% 7.91%, 99.19% 9.35%, 98.26% 11.1%, 99.05% 12.6%, 98.88% 14.1%, 98.86% 16.11%, 98.93% 18.41%, 98.75% 20.03%, 98.91% 22.41%, 99.04% 24.42%, 98.7% 26.32%, 99.02% 27.53%, 99.14% 29.64%, 98.98% 31.75%, 98.87% 33.56%, 98.76% 35.03%, 99.05% 37.06%, 98.93% 39.19%, 98.82% 40.52%, 98.49% 41.77%, 99.16% 43.27%, 98.84% 45.58%, 98.93% 47.45%, 99% 48.81%, 99.24% 50.35%, 99.2% 51.58%, 98.81% 53.09%, 99.11% 55.17%, 98.43% 57.04%, 99.11% 58.69%, 99.06% 60.13%, 98.99% 61.66%, 99.21% 63.23%, 98.85% 64.71%, 98.91% 66.21%, 98.97% 67.81%, 98.72% 69.1%, 99.18% 70.96%, 98.89% 72.18%, 98.73% 73.93%, 99.15% 75.57%, 98.79% 76.83%, 98.9% 78.52%, 99.12% 80.14%, 99.19% 81.7%, 99.19% 83.21%, 99.17% 85.08%, 98.21% 87.11%, 99.01% 89.01%, 99.07% 90.4%, 99.22% 91.62%, 98.84% 93.41%, 98.81% 95.09%, 99.1% 96.58%, 98.99% 98.65%, 99.25% 99.18%, 96.97% 99.05%, 95.45% 99.06%, 93.05% 98.89%, 91.18% 99.05%, 89.46% 98.86%, 88.06% 98.77%, 85.72% 98.79%, 83.78% 99.18%, 82.39% 99.18%, 80.93% 98.9%, 78.94% 98.96%, 76.94% 98.81%, 74.84% 99.19%, 72.6% 99.18%, 70.95% 98.85%, 69.52% 98.89%, 67.53% 98.72%, 66.29% 98.82%, 64.73% 99.15%, 63.31% 98.94%, 61.37% 98.89%, 59.22% 98.7%, 57.7% 99.13%, 55.9% 98.92%, 54.64% 98.71%, 52.7% 98.78%, 51.19% 98.21%, 49.56% 99.15%, 48.16% 98.84%, 46.23% 98.91%, 44.15% 98.34%, 41.93% 99.14%, 39.88% 98.86%, 38.02% 98.64%, 36.55% 99.15%, 34.38% 98.89%, 33.14% 99.06%, 31.57% 98.97%, 30.02% 98.93%, 28.77% 99.22%, 27.39% 98.9%, 25.83% 99.21%, 24.27% 99.15%, 22.95% 98.96%, 21.28% 98.76%, 19.78% 99.13%, 17.55% 99.07%, 15.97% 99.11%, 14.25% 98.98%, 12.18% 98.83%, 9.85% 98.49%, 8.13% 98.74%, 5.87% 98.96%, 3.74% 98.8%, 1.85% 99.04%, 1.04% 99.25%, 1.31% 98%, 1.26% 96.18%, 1.19% 94.49%, 1.24% 93.23%, 1.06% 91.02%, 1.06% 89.17%, 1.19% 86.82%, 0.97% 85.32%, 0.9% 84.07%, 0.81% 82.1%, 0.91% 80.41%, 1.15% 78.63%, 0.89% 77.08%, 0.82% 75.53%, 1.11% 73.66%, 1.29% 72.22%, 1.13% 70.53%, 1.05% 68.85%, 0.97% 67.33%, 1.45% 66.08%, 0.94% 64.1%, 0.79% 62.5%, 1.14% 61.01%, 0.98% 59.48%, 0.79% 57.15%, 1.07% 55.42%, 1.28% 53.2%, 0.86% 51.07%, 0.89% 49.79%, 0.86% 48.2%, 1.18% 46.47%, 0.97% 45.19%, 0.91% 42.88%, 1.08% 41.09%, 1.2% 39.13%, 1.09% 37.03%, 1.24% 34.66%, 1.25% 32.27%, 1.23% 30.06%, 1.06% 28.19%, 1.1% 26.41%, 0.84% 25.16%, 1.26% 23.91%, 0.76% 22.06%, 1.14% 20.82%, 0.98% 18.89%, 0.86% 16.7%, 1.19% 14.35%, 0.91% 13.09%, 1.06% 10.87%, 1.11% 9.22%, 0.77% 7.34%, 1.14% 5.03%, 1.84% 3.32%, 0.77% 1.1%);
}
.region-tile-photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: sepia(0.2) saturate(1.22) contrast(1.08) brightness(1.03);
  -webkit-transition: transform 0.6s ease;
  -moz-transition: transform 0.6s ease;
  -ms-transition: transform 0.6s ease;
  -o-transition: transform 0.6s ease;
  transition: transform 0.6s ease;
}
.region-tile-photo:before, .region-tile-photo:after {
  content: "";
  position: absolute;
  z-index: 1;
  pointer-events: none;
}
.region-tile-photo:before {
  inset: 0;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 50%, rgba(10, 7, 4, 0.5) 68%, rgba(10, 7, 4, 0.93) 100%);
  box-shadow: inset 0 0 16px 2px rgba(38, 20, 6, 0.45);
}
.region-tile-photo:after {
  inset: 4.5%;
  border: 1px solid rgba(240, 222, 184, 0.16);
  box-shadow: 0 0 0 1px rgba(20, 12, 5, 0.12);
}
.region-tile:hover .region-tile-photo img {
  transform: scale(1.06);
}
.region-tile:hover .region-tile-arrow {
  border-color: #c9a84c;
  color: #c9a84c;
  transform: translateX(3px);
}
.region-tile-caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 0 20px 20px;
}
.region-tile-text {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
  flex: 1 1 auto;
}
.region-tile-text strong {
  font-family: "AlegreyaSC-Bold";
  font-size: 24px;
  line-height: 1.1;
  letter-spacing: 0.03em;
  color: #f1e3c6;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.8);
}
.region-tile-text small {
  font-family: "Roboto-Light";
  font-size: 14px;
  line-height: 1.35;
  color: #e2d3b6;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.8);
}
.region-tile-arrow {
  flex: none;
  margin-left: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  color: #d9b865;
  background: rgba(0, 0, 0, 0.5);
  border: 2px solid rgba(201, 168, 76, 0.8);
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -webkit-transition: all 0.25s ease;
  -moz-transition: all 0.25s ease;
  -ms-transition: all 0.25s ease;
  -o-transition: all 0.25s ease;
  transition: all 0.25s ease;
}
.region-tile-arrow svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}
@media only screen and (max-width: 767px) {
  .region-tile-caption {
    gap: 10px;
    padding: 0 14px 14px;
  }
  .region-tile-arrow {
    width: 32px;
    height: 32px;
  }
  .region-tile-arrow svg {
    width: 15px;
    height: 15px;
  }
  .region-tile-text strong {
    font-size: 19px;
  }
}

/* ========== Timeline: "Kulture kroz vreme" ========== */
.eras {
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 4% 90px;
}
@media only screen and (max-width: 767px) {
  .eras {
    padding: 0 5% 60px;
  }
}
.eras > h2 {
  position: relative;
  margin-bottom: 16px;
  font-family: "AlegreyaSC-Bold";
  font-size: clamp(24px, 2.2vw, 32px);
  text-align: center;
  color: #f1e3c6;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.8);
}
.eras > h2:after {
  content: "";
  display: block;
  width: 240px;
  height: 1px;
  margin: 14px auto 0;
  background: linear-gradient(to right, transparent, #c9a84c 44%, transparent 44%, transparent 56%, #c9a84c 56%, transparent);
}
.eras > h2:before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -3px;
  width: 7px;
  height: 7px;
  margin-left: -3.5px;
  background: #c9a84c;
  transform: rotate(45deg);
}

.eras-note {
  max-width: 720px;
  margin: 0 auto 30px;
  font-family: "Roboto-Light";
  font-size: 15px;
  line-height: 1.6;
  text-align: center;
  color: #b3a48f;
}

.eras-plot {
  --label: 170px;
  --pad: 18px;
  --top: 36px;
  --axis: 36px;
  position: relative;
  max-width: 1040px;
  margin: 0 auto;
  padding-top: var(--top);
}
@media only screen and (max-width: 767px) {
  .eras-plot {
    --label: 104px;
    --pad: 9px;
  }
}
.eras-plot:before {
  content: "";
  position: absolute;
  top: var(--top);
  bottom: var(--axis);
  left: var(--label);
  right: 0;
  padding: 6px var(--pad);
  background: repeating-linear-gradient(to right, rgba(201, 168, 76, 0.13) 0 1px, transparent 1px 13.5135%) content-box, linear-gradient(rgba(0, 0, 0, 0.28), rgba(0, 0, 0, 0.28)) padding-box;
  background-clip: content-box, padding-box;
  border: 1px solid rgba(201, 168, 76, 0.42);
  box-shadow: inset 0 0 0 3px rgba(0, 0, 0, 0.4), inset 0 0 0 4px rgba(201, 168, 76, 0.16), inset 0 14px 30px rgba(0, 0, 0, 0.35), 0 1px 0 rgba(255, 255, 255, 0.04);
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  pointer-events: none;
}

.eras-era,
.eras-event {
  position: absolute;
  bottom: var(--axis);
  left: calc(var(--label) + var(--pad) + (100% - var(--label) - 2 * var(--pad)) * (var(--at) + 2000) / 3700);
  pointer-events: none;
}

.eras-era {
  top: var(--top);
  border-left: 1px solid rgba(201, 168, 76, 0.45);
}
.eras-era:before, .eras-era:after {
  content: "";
  position: absolute;
  left: -4px;
  width: 7px;
  height: 7px;
  background: #c9a84c;
  transform: rotate(45deg);
}
.eras-era:before {
  top: -3px;
}
.eras-era:after {
  bottom: -3px;
}

.eras-event {
  top: 5px;
  border-left: 1px dashed rgba(226, 196, 142, 0.65);
}
.eras-event:before {
  content: "";
  position: absolute;
  left: -4px;
  top: -3px;
  width: 7px;
  height: 7px;
  background: #e2c48e;
  transform: rotate(45deg);
}
.eras-event span {
  position: absolute;
  top: -5px;
  right: 9px;
  padding: 5px 10px 4px;
  font-family: "AlegreyaSC-Regular";
  font-size: 13px;
  line-height: 1.1;
  letter-spacing: 0.04em;
  color: #e2c48e;
  white-space: nowrap;
  background: rgba(20, 14, 9, 0.85);
  border: 1px solid rgba(201, 168, 76, 0.45);
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}

.eras-rows {
  position: relative;
  padding: 12px 0;
}
.eras-rows a {
  display: grid;
  grid-template-columns: var(--label) 1fr;
  align-items: center;
  padding: 7px 0;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  transition: background-color 0.2s ease;
}
.eras-rows a:hover, .eras-rows a:focus-visible {
  background: rgba(201, 168, 76, 0.09);
  outline: none;
}
.eras-rows a:hover strong, .eras-rows a:focus-visible strong {
  color: #c9a84c;
}
.eras-rows a:hover .eras-label:after, .eras-rows a:focus-visible .eras-label:after {
  opacity: 1;
  transform: translateY(-50%) rotate(45deg);
}
.eras-rows a:hover .eras-bar, .eras-rows a:focus-visible .eras-bar {
  filter: brightness(1.22);
  box-shadow: inset 0 1px 0 rgba(255, 240, 190, 0.5), inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 0 12px rgba(201, 168, 76, 0.6);
}

.eras-label {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 0 28px 0 8px;
}
.eras-label:after {
  content: "";
  position: absolute;
  right: 16px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-top: 2px solid #c9a84c;
  border-right: 2px solid #c9a84c;
  opacity: 0;
  transform: translate(-6px, -50%) rotate(45deg);
  transition: opacity 0.2s ease, transform 0.25s ease;
}
.eras-label strong {
  font-family: "AlegreyaSC-Bold";
  font-size: 17px;
  line-height: 1.1;
  letter-spacing: 0.03em;
  color: #f1e3c6;
  -webkit-transition: color 0.2s ease;
  -moz-transition: color 0.2s ease;
  -ms-transition: color 0.2s ease;
  -o-transition: color 0.2s ease;
  transition: color 0.2s ease;
}
.eras-label small {
  font-family: "Roboto-Light";
  font-size: 12px;
  line-height: 1.2;
  color: #a89a86;
  font-variant-numeric: tabular-nums;
}
@media only screen and (max-width: 767px) {
  .eras-label {
    padding: 0 6px 0 4px;
  }
  .eras-label:after {
    display: none;
  }
  .eras-label strong {
    font-size: 15px;
  }
  .eras-label small {
    font-size: 11px;
  }
}

.eras-track {
  position: relative;
  height: 14px;
  margin: 0 var(--pad);
}
.eras-track:before {
  content: "";
  position: absolute;
  left: calc(8px - var(--pad));
  right: calc(8px - var(--pad));
  top: 6px;
  height: 1px;
  background: rgba(0, 0, 0, 0.55);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.05);
}

.eras-bar {
  position: absolute;
  top: 1px;
  left: calc((var(--from) + 2000) / 3700 * 100%);
  width: calc((var(--to) - var(--from)) / 3700 * 100%);
  min-width: 5px;
  height: 12px;
  background: linear-gradient(to bottom, #dfc070 0%, #b8963f 50%, #8f7030 100%);
  box-shadow: inset 0 1px 0 rgba(255, 240, 190, 0.45), inset 0 -1px 0 rgba(0, 0, 0, 0.3), 0 2px 5px rgba(0, 0, 0, 0.7);
  transform-origin: left center;
  transition: filter 0.2s ease, box-shadow 0.2s ease, transform 0.9s cubic-bezier(0.2, 0.8, 0.3, 1);
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.eras.aos-init .eras-bar {
  transform: scaleX(0);
}

.eras.aos-animate .eras-bar {
  transform: none;
}

.eras.aos-animate li:nth-child(1) .eras-bar {
  transition-delay: 0s, 0s, 0.21s;
}

.eras.aos-animate li:nth-child(2) .eras-bar {
  transition-delay: 0s, 0s, 0.27s;
}

.eras.aos-animate li:nth-child(3) .eras-bar {
  transition-delay: 0s, 0s, 0.33s;
}

.eras.aos-animate li:nth-child(4) .eras-bar {
  transition-delay: 0s, 0s, 0.39s;
}

.eras.aos-animate li:nth-child(5) .eras-bar {
  transition-delay: 0s, 0s, 0.45s;
}

.eras.aos-animate li:nth-child(6) .eras-bar {
  transition-delay: 0s, 0s, 0.51s;
}

.eras.aos-animate li:nth-child(7) .eras-bar {
  transition-delay: 0s, 0s, 0.57s;
}

.eras.aos-animate li:nth-child(8) .eras-bar {
  transition-delay: 0s, 0s, 0.63s;
}

.eras.aos-animate li:nth-child(9) .eras-bar {
  transition-delay: 0s, 0s, 0.69s;
}

.eras.aos-animate li:nth-child(10) .eras-bar {
  transition-delay: 0s, 0s, 0.75s;
}

.eras.aos-animate li:nth-child(11) .eras-bar {
  transition-delay: 0s, 0s, 0.81s;
}

.eras.aos-animate li:nth-child(12) .eras-bar {
  transition-delay: 0s, 0s, 0.87s;
}

.eras-axis {
  position: relative;
  height: var(--axis);
  margin: 0 var(--pad) 0 calc(var(--label) + var(--pad));
}
.eras-axis span {
  position: absolute;
  top: 13px;
  left: calc((var(--at) + 2000) / 3700 * 100%);
  font-family: "AlegreyaSC-Regular";
  font-size: 14px;
  line-height: 1.2;
  letter-spacing: 0.04em;
  color: #b9a887;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  transform: translateX(-50%);
}
.eras-axis span:before {
  content: "";
  position: absolute;
  left: 50%;
  top: -13px;
  width: 1px;
  height: 7px;
  background: rgba(201, 168, 76, 0.7);
}
.eras-axis span:first-child {
  transform: none;
}
.eras-axis span:first-child:before {
  left: 0;
}
@media only screen and (max-width: 767px) {
  .eras-axis span {
    font-size: 12px;
  }
  .eras-axis .is-minor {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .eras.aos-init .eras-bar {
    transform: none;
    transition: none;
  }
}
/* ========== About banner ========== */
.about-banner {
  position: relative;
  overflow: hidden;
  aspect-ratio: 2172/592;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 4%, rgba(0, 0, 0, 0.45) 9%), #14100c url("/img/dizajn1/about-bg.webp") no-repeat center/100% 100%;
  box-shadow: 0 -8px 20px rgba(0, 0, 0, 0.45);
  margin-bottom: -1%;
}
.about-banner-map {
  position: absolute;
  left: 17%;
  top: 50%;
  width: 32%;
  transform: translateY(-50%);
  height: auto;
  filter: drop-shadow(0 8px 14px rgba(0, 0, 0, 0.55)) brightness(0.82) saturate(0.92);
}
.about-banner-text {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 55%;
  width: 25%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}
.about-banner-text h2 {
  font-family: "AlegreyaSC-Bold";
  font-size: clamp(22px, 2.1vw, 40px);
  line-height: 1.15;
  color: #f1e3c6;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.8);
  margin-bottom: 0.55em;
}
.about-banner-text p {
  font-family: "Roboto-Light";
  font-size: clamp(13px, 0.95vw, 18px);
  line-height: 1.55;
  color: #e3d3b4;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8);
  margin-bottom: 0.9em;
}
.about-banner-text .btn-outline {
  margin-top: 0.4em;
}
@media only screen and (max-width: 1279px) {
  .about-banner {
    aspect-ratio: auto;
    background: none;
    box-shadow: none;
    margin-bottom: 0;
    padding: 0 5% 70px;
  }
}
@media only screen and (max-width: 1279px) and (min-width: 768px) {
  .about-banner {
    padding-bottom: calc(calc(max(170px, 21.65vw) * 0.301) + 20px);
  }
}
@media only screen and (max-width: 1279px) {
  .about-banner-map {
    position: static;
    display: block;
    width: 100%;
    max-width: 680px;
    margin: 0 auto 30px;
    transform: none;
  }
  .about-banner-text {
    position: static;
    width: auto;
    max-width: 620px;
    margin: 0 auto;
    display: block;
    text-align: center;
  }
  .about-banner-text h2 {
    font-size: 28px;
  }
  .about-banner-text p {
    font-size: 15px;
  }
}

.icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.icon:before {
  content: "";
  width: 1em;
  height: 1em;
  background: currentColor;
  -webkit-mask: var(--icon) center/contain no-repeat;
  mask: var(--icon) center/contain no-repeat;
}

.icon-camera {
  --icon: url('/img/icons/camera.svg');
}

.icon-compass {
  --icon: url('/img/icons/compass.svg');
}

.icon-film {
  --icon: url('/img/icons/film.svg');
}

.icon-globe {
  --icon: url('/img/icons/globe.svg');
}

.icon-instagram {
  --icon: url('/img/icons/instagram.svg');
}

.icon-video {
  --icon: url('/img/icons/video.svg');
}

.icon-youtube {
  --icon: url('/img/icons/youtube.svg');
}

.btn-outline.btn-icon {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.btn-outline.btn-icon .icon {
  font-size: 16px;
}

.btn-outline {
  display: inline-block;
  padding: 14px 38px;
  font-family: "AlegreyaSC-Bold";
  font-size: 16px;
  letter-spacing: 0.08em;
  color: #f1e3c6;
  background: linear-gradient(to bottom, #4a3522, #22180f);
  border: 1px solid #c9a84c;
  box-shadow: inset 0 0 0 3px #22180f, inset 0 0 0 4px rgba(201, 168, 76, 0.55), 0 4px 12px rgba(0, 0, 0, 0.55);
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
.btn-outline:hover {
  color: #1b140e;
  background: #c9a84c;
  box-shadow: inset 0 0 0 3px #c9a84c, inset 0 0 0 4px rgba(27, 20, 14, 0.4), 0 4px 12px rgba(0, 0, 0, 0.55);
}

/* ========== Article page (e.g. /sr/asteci) ========== */
.page-hero {
  position: relative;
  overflow: hidden;
  height: 62vh;
  min-height: 380px;
  max-height: 640px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.page-hero:after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.25) 20%, rgba(0, 0, 0, 0.7) 100%), linear-gradient(to bottom, rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.45));
  pointer-events: none;
}
@media only screen and (max-width: 767px) {
  .page-hero {
    height: 48vh;
    min-height: 300px;
  }
}

.page-hero-content {
  position: relative;
  z-index: 2;
  padding: 40px 20px 0;
}
.page-hero-content h1 {
  font-family: "AlegreyaSC-Bold";
  font-size: clamp(56px, 8vw, 120px);
  line-height: 1;
  letter-spacing: 0.04em;
  color: #f1e3c6;
  text-shadow: 0 4px 18px rgba(0, 0, 0, 0.85);
}
.page-hero-content p {
  margin-top: 14px;
  font-family: "AlegreyaSC-Italic";
  font-size: clamp(18px, 1.8vw, 26px);
  color: #c9a84c;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.9);
}

.page-hero-kicker {
  display: inline-block;
  margin-bottom: 16px;
  padding: 7px 16px;
  font-family: "Roboto-Medium";
  font-size: 13px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #e2c48e;
  background: rgba(0, 0, 0, 0.45);
  border: 1px solid rgba(201, 168, 76, 0.5);
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}

.page-band {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 74px;
  padding: 15px 20px;
  background: linear-gradient(rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.35)), #14100c url("/img/dizajn1/head-mid.webp") center -6px/auto 100px repeat-x;
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.6), 0 -8px 18px rgba(0, 0, 0, 0.45);
}
.page-band:before, .page-band:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 9px;
  background: url("/img/dizajn1/head-mid.webp") center bottom/auto 100px repeat-x;
  pointer-events: none;
}
.page-band:before {
  top: 0;
  transform: scaleY(-1);
}
.page-band:after {
  bottom: 0;
}

.breadcrumbs {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  font-family: "AlegreyaSC-Bold";
  font-size: 18px;
  letter-spacing: 0.04em;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.9);
}
.breadcrumbs a {
  color: #cbb488;
}
.breadcrumbs a:hover {
  color: #c9a84c;
}
.breadcrumbs span {
  font-size: 8px;
  color: #c9a84c;
}
.breadcrumbs strong {
  color: #c9a84c;
}

/* ---------- content ---------- */
.article-page {
  max-width: 1240px;
  margin: 0 auto;
  padding: 70px 4% 40px;
}
@media only screen and (max-width: 767px) {
  .article-page {
    padding: 44px 5% 20px;
  }
}
.article-page > .row {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -24px;
}
.article-page > .row > .column {
  padding: 0 24px;
}
@media only screen and (max-width: 767px) {
  .article-page > .row > .column {
    padding: 0 24px;
  }
}

.article {
  font-family: "Roboto-Regular";
  font-size: 17px;
  line-height: 1.8;
  color: #d8c9ae;
}
@media only screen and (max-width: 767px) {
  .article {
    font-size: 16px;
  }
}
.article p,
.article li {
  margin-bottom: 1.1em;
  line-height: 1.8;
}
.article em {
  font-family: "Roboto-Italic";
  color: #f1e3c6;
}
.article h2 {
  position: relative;
  margin: 1.9em 0 0.7em;
  padding-bottom: 14px;
  font-family: "AlegreyaSC-Bold";
  font-size: clamp(26px, 2.3vw, 34px);
  line-height: 1.2;
  letter-spacing: 0.02em;
  color: #f1e3c6;
}
.article h2:before, .article h2:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
}
.article h2:before {
  width: 140px;
  height: 1px;
  background: linear-gradient(to right, #c9a84c, transparent);
}
.article h2:after {
  width: 7px;
  height: 7px;
  bottom: -3px;
  background: #c9a84c;
  transform: rotate(45deg);
}

.article-lead {
  font-size: 1.2em;
  line-height: 1.7;
  color: #eadcc1;
}
.article-lead:first-letter {
  float: left;
  margin: 6px 12px 0 0;
  font-family: "AlegreyaSC-Bold";
  font-size: 4.1em;
  line-height: 0.8;
  color: #c9a84c;
  text-shadow: 0 3px 10px rgba(0, 0, 0, 0.7);
}

.article-figure {
  margin: 2.2em 0;
}
.article-figure img {
  display: block;
  width: 100%;
  height: auto;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.6);
}
.article-figure figcaption {
  margin-top: 12px;
  font-family: "Roboto-Italic";
  font-size: 14px;
  line-height: 1.5;
  color: #a89a86;
  text-align: center;
}

.article-quote {
  position: relative;
  margin: 2.2em 0;
  padding: 34px 36px 30px 84px;
  background: rgba(0, 0, 0, 0.3);
  border-left: 3px solid #c9a84c;
  box-shadow: inset 0 0 0 1px rgba(201, 168, 76, 0.2);
}
.article-quote:before {
  content: "“";
  position: absolute;
  left: 22px;
  top: 6px;
  font-family: Georgia, serif;
  font-size: 90px;
  line-height: 1;
  color: #c9a84c;
  opacity: 0.8;
}
.article-quote p {
  margin: 0 0 12px;
  font-family: "Roboto-Italic";
  font-size: 1.2em;
  line-height: 1.6;
  color: #f1e3c6;
}
.article-quote cite {
  font-family: "Roboto-Light";
  font-size: 14px;
  font-style: normal;
  color: #b3a48f;
}
@media only screen and (max-width: 767px) {
  .article-quote {
    padding: 56px 20px 22px;
  }
  .article-quote:before {
    left: 16px;
    top: 0;
  }
}

/* ---------- aside ---------- */
.article-aside {
  position: sticky;
  top: 24px;
  display: flex;
  flex-direction: column;
  gap: 26px;
}
@media only screen and (max-width: 1023px) {
  .article-aside {
    position: static;
    margin-top: 30px;
  }
}

.facts-card {
  padding: 28px 28px 24px;
  background: #1b140e url("/img/background-tile.webp") repeat center;
  border: 1px solid rgba(201, 168, 76, 0.55);
  box-shadow: inset 0 0 0 5px rgba(0, 0, 0, 0.35), inset 0 0 0 6px rgba(201, 168, 76, 0.22), 0 14px 30px rgba(0, 0, 0, 0.55);
}
.facts-card h2 {
  position: static;
  margin: 0 0 18px;
  padding-bottom: 12px;
  font-family: "AlegreyaSC-Bold";
  font-size: 22px;
  line-height: 1;
  letter-spacing: 0.04em;
  color: #c9a84c;
  border-bottom: 1px solid rgba(201, 168, 76, 0.3);
}
.facts-card h2:before, .facts-card h2:after {
  content: none;
}
.facts-card dl {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px 16px;
  font-size: 15px;
  line-height: 1.4;
}
.facts-card dt,
.facts-card dd {
  line-height: 1.4;
}
.facts-card dt {
  font-family: "Roboto-Light";
  color: #a89a86;
}
.facts-card dd {
  font-family: "Roboto-Medium";
  color: #f1e3c6;
  text-align: right;
}

.timeline {
  position: relative;
  padding-left: 22px;
}
.timeline:before {
  content: "";
  position: absolute;
  left: 4px;
  top: 6px;
  bottom: 6px;
  width: 1px;
  background: linear-gradient(to bottom, #c9a84c, rgba(201, 168, 76, 0.15));
}
.timeline li {
  position: relative;
  margin-bottom: 16px;
  font-family: "Roboto-Light";
  font-size: 15px;
  line-height: 1.45;
  color: #d8c9ae;
}
.timeline li strong {
  line-height: 1.3;
}
.timeline li:last-child {
  margin-bottom: 0;
}
.timeline li:before {
  content: "";
  position: absolute;
  left: -21px;
  top: 6px;
  width: 7px;
  height: 7px;
  background: #c9a84c;
  box-shadow: 0 0 6px rgba(201, 168, 76, 0.7);
  transform: rotate(45deg);
}
.timeline li strong {
  display: block;
  font-family: "AlegreyaSC-Bold";
  font-size: 17px;
  color: #c9a84c;
}

.aside-figure img {
  display: block;
  width: 100%;
  height: auto;
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.55);
}
.aside-figure figcaption {
  margin-top: 10px;
  font-family: "Roboto-Italic";
  font-size: 14px;
  color: #a89a86;
  text-align: center;
}
@media only screen and (max-width: 1023px) {
  .aside-figure {
    max-width: 420px;
    margin: 0 auto;
  }
}

/* ---------- related ---------- */
.related {
  max-width: 1320px;
  margin: 0 auto;
  padding: 30px 4% 90px;
}
@media only screen and (max-width: 767px) {
  .related {
    padding: 20px 5% 60px;
  }
}
.related > h2 {
  margin-bottom: 30px;
  font-family: "AlegreyaSC-Bold";
  font-size: clamp(24px, 2.2vw, 32px);
  text-align: center;
  color: #f1e3c6;
}
.related > h2:after {
  content: "";
  display: block;
  width: 160px;
  height: 1px;
  margin: 14px auto 0;
  background: linear-gradient(to right, transparent, #c9a84c, transparent);
}
.related .row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0 -8px;
}
.related .row > .column {
  padding: 0 8px 16px;
}
@media only screen and (min-width: 1280px) and (max-width: 1899px) {
  .related .row > .column:last-child:nth-child(3n) {
    margin-bottom: max(0px, calc(max(170px, 21.65vw) * 0.301) - 60px);
  }
}
@media only screen and (min-width: 768px) and (max-width: 1279px) {
  .related .row > .column:last-child:nth-child(2n) {
    margin-bottom: max(0px, calc(max(170px, 21.65vw) * 0.301) - 60px);
  }
}

/* ========== Parchment sheet (article content) ========== */
.paper {
  position: relative;
  width: min(1240px, 94vw);
  margin: 40px auto 30px;
  filter: drop-shadow(0 14px 26px rgba(0, 0, 0, 0.6));
}
@media only screen and (max-width: 767px) {
  .paper {
    width: 100%;
    margin: 26px 0 16px;
  }
}

.paper-top,
.paper-bottom {
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.paper-top {
  height: calc(min(1240px, 94vw) * 84 / 2048);
  background-image: url("/img/paper-top.webp");
}

.paper-body {
  position: relative;
  background: url("/img/paper-mid.webp") repeat-y center top/100% auto;
}

.paper-bottom {
  position: relative;
  height: calc(min(1240px, 94vw) * 96 / 2048);
  margin-top: calc(min(1240px, 94vw) * -36 / 2048);
  background-image: url("/img/paper-bottom.webp");
}

@media only screen and (max-width: 767px) {
  .paper-top {
    height: 4.1015625vw;
  }
  .paper-bottom {
    height: 4.6875vw;
    margin-top: -1.7578125vw;
  }
}
.paper .article-page {
  padding: 40px 7.5% 50px;
}
@media only screen and (max-width: 767px) {
  .paper .article-page {
    padding: 24px 9% 36px;
  }
}
.paper .article {
  color: #3b2a1a;
}
.paper .article em {
  color: #2a1b0e;
}
.paper .article h2 {
  color: #2b1c10;
}
.paper .article h2:before {
  background: linear-gradient(to right, #8a6a2f, transparent);
}
.paper .article h2:after {
  background: #8a6a2f;
}
.paper .article-lead {
  color: #2b1c10;
}
.paper .article-lead:first-letter {
  color: #7a3b16;
  text-shadow: none;
}
.paper .article-figure img {
  box-shadow: 0 6px 16px rgba(60, 38, 16, 0.35);
}
.paper .article-figure figcaption {
  color: #6b5236;
}
.paper .article-quote {
  background: rgba(122, 82, 36, 0.1);
  border-left-color: #8a6a2f;
  box-shadow: inset 0 0 0 1px rgba(122, 82, 36, 0.25);
}
.paper .article-quote:before {
  color: #8a6a2f;
}
.paper .article-quote p {
  color: #2b1c10;
}
.paper .article-quote cite {
  color: #6b5236;
}
.paper .facts-card {
  background: rgba(122, 82, 36, 0.08);
  border: 1px solid rgba(122, 82, 36, 0.45);
  box-shadow: inset 0 0 0 4px rgba(255, 240, 210, 0.18), inset 0 0 0 5px rgba(122, 82, 36, 0.25);
}
.paper .facts-card h2 {
  color: #7a3b16;
  border-bottom-color: rgba(122, 82, 36, 0.35);
}
.paper .facts-card dt {
  color: #6b5236;
}
.paper .facts-card dd {
  color: #2b1c10;
}
.paper .timeline:before {
  background: linear-gradient(to bottom, #8a6a2f, rgba(138, 106, 47, 0.15));
}
.paper .timeline li {
  color: #3b2a1a;
}
.paper .timeline li:before {
  background: #8a6a2f;
  box-shadow: none;
}
.paper .timeline li strong {
  color: #7a3b16;
}
.paper .aside-figure img {
  box-shadow: 0 6px 16px rgba(60, 38, 16, 0.35);
}
.paper .aside-figure figcaption {
  color: #6b5236;
}

/* ========== Figures floating in the text ========== */
.article h2 {
  clear: both;
}
.article:after {
  content: "";
  display: block;
  clear: both;
}
.article strong {
  font-family: "Roboto-Bold";
}

.article-figure.is-left, .article-figure.is-right {
  width: 46%;
  margin-top: 0.35em;
  margin-bottom: 1.2em;
}
.article-figure.is-left {
  float: left;
  margin-right: 30px;
}
.article-figure.is-right {
  float: right;
  margin-left: 30px;
}
.article-figure.is-narrow {
  width: 34%;
}
.article-figure.is-cutout img {
  border: 0;
  box-shadow: none;
  filter: drop-shadow(0 8px 12px rgba(60, 38, 16, 0.35));
}
.article-figure.is-blend img {
  border: 0;
  box-shadow: none;
  filter: none;
}
.article-figure.is-panorama {
  clear: both;
  margin-top: 1.4em;
}
.article-figure figcaption {
  text-align: left;
}
.article-figure figcaption strong {
  font-family: "Roboto-Bold";
  font-style: normal;
}
@media only screen and (max-width: 767px) {
  .article-figure.is-left, .article-figure.is-right, .article-figure.is-narrow {
    float: none;
    width: 100%;
    margin: 1.4em 0;
  }
  .article-figure.is-narrow {
    max-width: 300px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* ========== A story that is also a short video (.video-link) ========== */
.article-figure.has-video {
  position: relative;
  z-index: 1;
}

.video-link {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  width: fit-content;
  margin-top: 10px;
  font-family: "AlegreyaSC-Bold";
  font-style: normal;
  font-size: 17px;
  line-height: 1.3;
  letter-spacing: 0.04em;
  color: #c9a84c;
}
.video-link .icon {
  margin-top: 0.15em;
}
@media only screen and (max-width: 767px) {
  .video-link {
    font-size: 16px;
  }
}
.video-link:hover, .video-link:focus-visible {
  color: #f1e3c6;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.paper .video-link {
  color: #7a3b16;
}
.paper .video-link:hover, .paper .video-link:focus-visible {
  color: #2b1c10;
}

.article-closing {
  clear: both;
  margin-top: 1.6em;
  font-family: "AlegreyaSC-Italic";
  font-size: 1.25em;
  text-align: center;
  color: #7a3b16;
}

/* ========== Hover explanations (.tip) ========== */
.tip {
  position: relative;
  display: inline;
  color: #7a3b16;
  font-family: "Roboto-Medium";
  border-bottom: 1px dashed rgba(122, 59, 22, 0.7);
  cursor: help;
  outline: none;
  transition: color 0.2s ease, border-color 0.2s ease;
}
.tip:hover, .tip:focus {
  color: #4a1f06;
  border-bottom-style: solid;
}

.tip-box {
  --tip-shift: 0px;
  position: absolute;
  left: 50%;
  bottom: calc(100% + 14px);
  z-index: 30;
  display: block;
  width: 290px;
  padding: 16px 18px;
  font-family: "Roboto-Light";
  font-size: 14px;
  line-height: 1.55;
  text-align: left;
  color: #e3d3b4;
  background: #1b140e url("/img/background-tile.webp") repeat center;
  border: 1px solid rgba(201, 168, 76, 0.6);
  box-shadow: inset 0 0 0 4px rgba(0, 0, 0, 0.35), inset 0 0 0 5px rgba(201, 168, 76, 0.2), 0 16px 34px rgba(0, 0, 0, 0.55);
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate(calc(-50% + var(--tip-shift)), 8px);
  transition: opacity 0.22s ease, transform 0.25s ease, visibility 0s linear 0.25s;
}
.tip-box:after {
  content: "";
  position: absolute;
  left: calc(50% - var(--tip-shift));
  top: 100%;
  width: 12px;
  height: 12px;
  margin: -6px 0 0 -6px;
  background: #1b140e;
  border-right: 1px solid rgba(201, 168, 76, 0.6);
  border-bottom: 1px solid rgba(201, 168, 76, 0.6);
  transform: rotate(45deg);
}
.tip-box strong {
  display: block;
  margin-bottom: 6px;
  font-family: "AlegreyaSC-Bold";
  font-size: 17px;
  letter-spacing: 0.03em;
  color: #c9a84c;
}
.tip-box--wide {
  width: 340px;
  padding: 12px;
}
.tip-box--wide img {
  display: block;
  width: 100%;
  height: auto;
  margin-bottom: 12px;
  border: 1px solid rgba(201, 168, 76, 0.45);
}
.tip-box--wide > span {
  display: block;
  padding: 0 6px 4px;
}
.tip-box--tall img {
  max-height: 230px;
  object-fit: contain;
  background: #0e0a07;
}
.tip-box--slim {
  display: flex;
  align-items: center;
  gap: 14px;
}
.tip-box--slim img {
  width: 40px;
  margin: 0;
  border: 0;
}

.tip:hover .tip-box,
.tip:focus .tip-box,
.tip:focus-within .tip-box {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate(calc(-50% + var(--tip-shift)), 0);
  transition: opacity 0.22s ease, transform 0.25s ease, visibility 0s;
}

.tip-box--slim {
  display: flex;
}

.tip--below .tip-box {
  bottom: auto;
  top: calc(100% + 14px);
  transform: translate(calc(-50% + var(--tip-shift)), -8px);
}
.tip--below .tip-box:after {
  top: 0;
  border: 0;
  border-left: 1px solid rgba(201, 168, 76, 0.6);
  border-top: 1px solid rgba(201, 168, 76, 0.6);
}

.article strong,
.article em,
.article span,
.article a {
  vertical-align: baseline;
}

.tip-box,
.tip-box * {
  line-height: 1.55;
}

.tip-box strong {
  line-height: 1.2;
}

.article-quote {
  display: flow-root;
}

.article-page > .row > .column:only-child {
  width: 100%;
}

/* ========== Aside floats inside the text ========== */
.article-page {
  max-width: none;
}

.article > .article-aside {
  position: static;
  float: right;
  width: 32%;
  margin: 0 0 30px 40px;
}
@media only screen and (max-width: 1023px) {
  .article > .article-aside {
    float: none;
    width: 100%;
    margin: 0 0 30px;
  }
}

.article h2 {
  clear: left;
}
.article .article-figure.is-right {
  clear: right;
}

/* ========== Scroll animation of the article text ========== */
.js .article > p:not([data-aos]),
.js .article > h2:not([data-aos]),
.js .article > blockquote:not([data-aos]),
.js .article > ul:not([data-aos]),
.js .article > ol:not([data-aos]) {
  opacity: 0;
  animation: article-text-late 0s 3s forwards;
}

@keyframes article-text-late {
  to {
    opacity: 1;
  }
}
.article > [data-aos].aos-animate {
  transform: none;
}

.article > p {
  position: relative;
}
.article > p:focus-within {
  z-index: 5;
}
.article > p:has(.tip:hover) {
  z-index: 5;
}
@supports not selector(:has(a)) {
  .article > p:hover {
    z-index: 5;
  }
}

.article-list {
  margin: 0 0 1.1em;
  padding-left: 4px;
}
.article-list li {
  position: relative;
  margin-bottom: 0.4em;
  padding-left: 22px;
  line-height: 1.7;
}
.article-list li:before {
  content: "";
  position: absolute;
  left: 2px;
  top: 0.72em;
  width: 6px;
  height: 6px;
  background: #8a6a2f;
  transform: rotate(45deg);
}

/* ========== Fun fact box (.fun-fact) ========== */
.fun-fact {
  clear: both;
  margin: 2.6em 0 1em;
  padding: 34px 40px 28px;
  text-align: center;
  background: rgba(122, 82, 36, 0.08);
  border: 1px solid rgba(122, 82, 36, 0.45);
  box-shadow: inset 0 0 0 4px rgba(255, 240, 210, 0.18), inset 0 0 0 5px rgba(122, 82, 36, 0.25);
}
.fun-fact h3 {
  margin-bottom: 16px;
  font-family: "AlegreyaSC-Bold";
  font-size: clamp(24px, 2.2vw, 30px);
  line-height: 1.2;
  letter-spacing: 0.02em;
  color: #7a3b16;
}
.fun-fact p {
  max-width: 780px;
  margin: 0 auto 1.5em;
  font-size: 16px;
  line-height: 1.75;
}
@media only screen and (max-width: 1023px) {
  .fun-fact {
    padding: 30px 26px 24px;
  }
}
@media only screen and (max-width: 767px) {
  .fun-fact {
    padding: 28px 16px 20px;
  }
}

.fun-fact-label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-bottom: 12px;
  font-family: "Roboto-Medium";
  font-size: 12px;
  line-height: 1;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #8a6a2f;
}
.fun-fact-label:before, .fun-fact-label:after {
  content: "";
  width: 34px;
  height: 1px;
  background: linear-gradient(to right, transparent, #8a6a2f);
}
.fun-fact-label:after {
  background: linear-gradient(to left, transparent, #8a6a2f);
}

.fun-fact .fun-fact-note {
  margin: 16px auto 0;
  font-family: "Roboto-Italic";
  font-size: 13px;
  line-height: 1.6;
  color: #6b5236;
}
.fun-fact .fun-fact-note em {
  color: #6b5236;
}

.word-list {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  overflow: hidden;
}
.word-list li {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 18px 8px 16px;
  line-height: 1.3;
  box-shadow: -1px 0 0 rgba(122, 82, 36, 0.3), 0 -1px 0 rgba(122, 82, 36, 0.3);
}
@media only screen and (max-width: 767px) {
  .word-list {
    grid-template-columns: repeat(2, 1fr);
  }
}

.word-list-word {
  font-family: "AlegreyaSC-BoldItalic";
  font-size: 24px;
  line-height: 1.1;
  color: #7a3b16;
}
@media only screen and (max-width: 1023px) {
  .word-list-word {
    font-size: 20px;
  }
}

.word-list-meaning,
.word-list-note {
  line-height: 1.35;
}

.word-list-meaning {
  font-family: "Roboto-Medium";
  font-size: 15px;
  color: #2b1c10;
}
@media only screen and (max-width: 1023px) {
  .word-list-meaning {
    font-size: 14px;
  }
}

.word-list-note {
  font-family: "Roboto-Italic";
  font-size: 13px;
  color: #6b5236;
}

/* ========== Picture printed on the parchment (.article-figure.is-print) ========== */
.paper .article-figure.is-print {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print img {
  box-shadow: none;
  filter: sepia(0.42) saturate(0.85) contrast(1.04) url(#paper-edge);
}
.paper .article-figure.is-print.is-narrow img {
  filter: sepia(0.42) saturate(0.85) contrast(1.04) url(#paper-edge-fine);
}

.paper .article-figure.is-print2 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print2 img {
  box-shadow: none;
  filter: sepia(0.32) saturate(0.9) contrast(1.03) url(#paper-edge-soft);
}

.paper .article-figure.is-print3 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print3 img {
  box-shadow: none;
  filter: sepia(0.22) saturate(0.95) contrast(1.03) url(#paper-edge-fade);
}

.paper .article-figure.is-print4 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print4 img {
  box-shadow: none;
  filter: sepia(0.38) saturate(0.88) contrast(1.04) url(#paper-edge-burnt);
}

.paper .article-figure.is-print5 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print5 img {
  box-shadow: none;
  filter: grayscale(1) sepia(0.85) contrast(1.18) brightness(1.05) url(#paper-edge-ink);
}

.paper .article-figure.is-print6 img {
  box-sizing: border-box;
  padding: 2.6%;
  background: #efe4c8;
  box-shadow: none;
  filter: sepia(0.28) saturate(0.9) url(#paper-edge-deckle) drop-shadow(0 6px 9px rgba(60, 38, 16, 0.45));
  transform: rotate(-1.2deg);
}

.paper .article-figure.is-print7 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print7 img {
  box-shadow: none;
  filter: sepia(0.4) saturate(0.85) contrast(1.05);
  -webkit-mask-image: radial-gradient(ellipse closest-side at center, #000 58%, rgba(0, 0, 0, 0.6) 80%, transparent 100%);
  mask-image: radial-gradient(ellipse closest-side at center, #000 58%, rgba(0, 0, 0, 0.6) 80%, transparent 100%);
}

.paper .article-figure.is-print8 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print8 img {
  box-shadow: none;
  filter: sepia(0.12) saturate(1.15) url(#paper-edge-wash);
}

.paper .article-figure.is-print9 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print9 img {
  box-shadow: none;
  filter: sepia(0.65) saturate(0.55) contrast(0.64) brightness(1.42) url(#paper-edge-soft);
}

.paper .article-figure.is-print10 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print10 img {
  box-sizing: border-box;
  padding: 7px;
  border: 4px double #4a2f17;
  box-shadow: none;
  filter: sepia(0.45) saturate(0.8) contrast(1.06) url(#paper-line-rough);
}

/* ---------- .is-print11 - 20: combinations of the edges, tones and frames above ---------- */
.paper .article-figure.is-print11 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print11 img {
  box-shadow: none;
  filter: grayscale(1) sepia(0.85) contrast(1.15) brightness(1.05) url(#paper-edge-burnt);
}

.paper .article-figure.is-print12 img {
  box-sizing: border-box;
  padding: 4%;
  background: #efe4c8;
  box-shadow: none;
  filter: sepia(0.3) saturate(0.9) url(#paper-edge-burnt) drop-shadow(0 6px 9px rgba(60, 38, 16, 0.45));
  transform: rotate(1deg);
}

.paper .article-figure.is-print13 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print13 img {
  box-shadow: none;
  filter: grayscale(1) sepia(0.8) contrast(1.12);
  -webkit-mask-image: radial-gradient(ellipse closest-side at center, #000 76%, transparent 94%);
  mask-image: radial-gradient(ellipse closest-side at center, #000 76%, transparent 94%);
}

.paper .article-figure.is-print14 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print14 img {
  box-shadow: none;
  filter: sepia(1) saturate(1.7) hue-rotate(-6deg) contrast(1.04) url(#paper-edge-fade);
}

.paper .article-figure.is-print15 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print15 img {
  box-sizing: border-box;
  padding: 7px;
  border: 4px double #4a2f17;
  box-shadow: none;
  filter: grayscale(1) sepia(0.85) contrast(1.15) brightness(1.05) url(#paper-line-rough);
}

.paper .article-figure.is-print16 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print16 img {
  box-shadow: none;
  border-radius: 50% 50% 0 0/36% 36% 0 0;
  filter: sepia(0.35) saturate(0.88) contrast(1.03) url(#paper-edge-soft);
}

.paper .article-figure.is-print17 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print17 img {
  box-shadow: none;
  filter: grayscale(1) sepia(1) hue-rotate(-28deg) saturate(2.2) contrast(1.08) brightness(1.05) url(#paper-edge);
}
.paper .article-figure.is-print17.is-narrow img {
  filter: grayscale(1) sepia(1) hue-rotate(-28deg) saturate(2.2) contrast(1.08) brightness(1.05) url(#paper-edge-fine);
}

.paper .article-figure.is-print18 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print18 img {
  box-shadow: none;
  filter: grayscale(1) contrast(1.7) brightness(1.1) url(#paper-edge-wash);
}

.paper .article-figure.is-print19 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print19 img {
  box-shadow: none;
  filter: sepia(0.5) saturate(0.75) contrast(0.96) url(#paper-edge-foxed);
}

.paper .article-figure.is-print20 {
  position: relative;
}
.paper .article-figure.is-print20 img {
  box-sizing: border-box;
  padding: 2.6%;
  background: #efe4c8;
  box-shadow: none;
  filter: grayscale(1) sepia(0.22) contrast(1.06) url(#paper-edge-deckle) drop-shadow(0 6px 9px rgba(60, 38, 16, 0.45));
  transform: rotate(1.4deg);
}
.paper .article-figure.is-print20:before, .paper .article-figure.is-print20:after {
  content: "";
  position: absolute;
  z-index: 1;
  top: 3px;
  width: clamp(46px, 22%, 80px);
  height: 22px;
  background: linear-gradient(rgba(240, 226, 182, 0.72), rgba(224, 206, 154, 0.72));
  box-shadow: 0 1px 3px rgba(60, 38, 16, 0.35);
}
.paper .article-figure.is-print20:before {
  left: -20px;
  transform: rotate(-36deg);
}
.paper .article-figure.is-print20:after {
  right: -20px;
  transform: rotate(39deg);
}

/* ---------- .is-print21 - 30: shapes, frames and photographs ---------- */
.paper .article-figure.is-print21 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print21 img {
  box-shadow: none;
  filter: sepia(0.3) saturate(0.9) contrast(1.03);
  clip-path: polygon(9% 0, 91% 0, 100% 100%, 0 100%);
}

.paper .article-figure.is-print22 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print22 img {
  box-shadow: none;
  filter: sepia(0.25) saturate(0.85) contrast(0.96) brightness(1.05) url(#paper-fresco);
}

.paper .article-figure.is-print23 {
  position: relative;
}
.paper .article-figure.is-print23 img {
  box-sizing: border-box;
  padding: 2.6%;
  background: #efe4c8;
  box-shadow: none;
  filter: sepia(0.2) saturate(0.92) url(#paper-edge-deckle) drop-shadow(0 6px 9px rgba(60, 38, 16, 0.45));
  transform: rotate(-1.6deg);
  transform-origin: 50% 0;
}
.paper .article-figure.is-print23:before {
  content: "";
  position: absolute;
  z-index: 1;
  left: 50%;
  top: -4px;
  width: 16px;
  height: 16px;
  margin-left: -8px;
  background: radial-gradient(circle at 35% 30%, #f0d48c, #b08232 55%, #6a4614);
  box-shadow: 0 3px 4px rgba(40, 24, 8, 0.55), inset 0 0 0 1px rgba(60, 38, 16, 0.4);
  border-radius: 50%;
}

.paper .article-figure.is-print24 img {
  box-sizing: border-box;
  padding: 10px;
  background: #1b140e url("/img/background-tile.webp") center/320px auto;
  border: 1px solid rgba(201, 168, 76, 0.8);
  outline: 1px solid rgba(201, 168, 76, 0.55);
  outline-offset: -11px;
  box-shadow: 0 8px 16px rgba(60, 38, 16, 0.5);
}

.paper .article-figure.is-print25 {
  position: relative;
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print25 img {
  box-shadow: none;
  filter: sepia(0.3) saturate(0.9) contrast(1.03) url(#paper-edge-soft);
}
.paper .article-figure.is-print25:after {
  content: "";
  position: absolute;
  z-index: 1;
  top: -16px;
  right: -14px;
  width: 78px;
  height: 78px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80' fill='none' stroke='%238c2f1b'%3E%3Ccircle cx='40' cy='40' r='37' stroke-width='3'/%3E%3Ccircle cx='40' cy='40' r='31.5' stroke-width='1.2'/%3E%3Ccircle cx='40' cy='40' r='18.500' stroke-width='1.2'/%3E%3Cpath d='M29 48.500h22M31 48.500v-5h18v5M34 43.500v-5h12v5M37 38.500v-5h6v5' stroke-width='1.6' stroke-linejoin='round'/%3E%3Cpath d='M65 37.8l2.2 2.2-2.2 2.2-2.2-2.2zM57.7 55.5l2.2 2.2-2.2 2.2-2.2-2.2zM40 62.8l2.2 2.2-2.2 2.2-2.2-2.2zM22.3 55.5l2.2 2.2-2.2 2.2-2.2-2.2zM15 37.8l2.2 2.2-2.2 2.2-2.2-2.2zM22.3 20.1l2.2 2.2-2.2 2.2-2.2-2.2zM40 12.8l2.2 2.2-2.2 2.2-2.2-2.2zM57.7 20.1l2.2 2.2-2.2 2.2-2.2-2.2z' fill='%238c2f1b' stroke='none'/%3E%3C/svg%3E") center/contain no-repeat;
  opacity: 0.72;
  transform: rotate(14deg);
  pointer-events: none;
}

.paper .article-figure.is-print26 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print26 img {
  box-sizing: border-box;
  padding: 6px;
  border: 4px double #4a2f17;
  border-radius: 50%;
  box-shadow: none;
  filter: sepia(0.4) saturate(0.85) contrast(1.05) url(#paper-line-rough);
}

.paper .article-figure.is-print27 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print27 img {
  box-shadow: none;
  filter: sepia(0.55) saturate(0.8) contrast(1.08) url(#paper-vignette) url(#paper-edge-soft);
}

.paper .article-figure.is-print28 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print28 img {
  box-shadow: none;
  filter: sepia(0.5) saturate(0.8) contrast(1.06) url(#paper-grain) url(#paper-edge-soft);
}

.paper .article-figure.is-print29 {
  mix-blend-mode: multiply;
}
.paper .article-figure.is-print29 img {
  box-shadow: none;
  filter: sepia(0.35) saturate(0.88) contrast(1.04);
  -webkit-mask: conic-gradient(from 135deg at top, rgba(0, 0, 0, 0), #000 1deg 89deg, rgba(0, 0, 0, 0) 90deg) top/14px 51% repeat-x, conic-gradient(from -45deg at bottom, rgba(0, 0, 0, 0), #000 1deg 89deg, rgba(0, 0, 0, 0) 90deg) bottom/14px 51% repeat-x;
  mask: conic-gradient(from 135deg at top, rgba(0, 0, 0, 0), #000 1deg 89deg, rgba(0, 0, 0, 0) 90deg) top/14px 51% repeat-x, conic-gradient(from -45deg at bottom, rgba(0, 0, 0, 0), #000 1deg 89deg, rgba(0, 0, 0, 0) 90deg) bottom/14px 51% repeat-x;
}

.paper .article-figure.is-print30 img {
  box-sizing: border-box;
  padding: 2.6%;
  background: #efe4c8;
  box-shadow: none;
  filter: sepia(0.3) saturate(0.9) url(#paper-fold) url(#paper-edge-deckle) drop-shadow(0 6px 9px rgba(60, 38, 16, 0.45));
}

/* ---------- .is-print31 - 40: the picture in its own colours, only the edge changes ---------- */
.paper .article-figure.is-print31 img {
  box-shadow: none;
  filter: url(#paper-edge);
}
.paper .article-figure.is-print31.is-narrow img {
  filter: url(#paper-edge-fine);
}

.paper .article-figure.is-print32 img {
  box-shadow: none;
  filter: url(#paper-edge-soft);
}

.paper .article-figure.is-print33 img {
  box-shadow: none;
  filter: url(#paper-edge-fade);
}

.paper .article-figure.is-print34 img {
  box-shadow: none;
  filter: url(#paper-edge-burnt);
}

.paper .article-figure.is-print35 img {
  box-shadow: none;
  filter: url(#paper-edge-brush);
}

.paper .article-figure.is-print36 img {
  box-shadow: none;
  filter: url(#paper-edge-sand);
}

.paper .article-figure.is-print37 img {
  box-sizing: border-box;
  padding: max(24px, 7%);
  background: #efe4c8;
  box-shadow: none;
  filter: url(#paper-edge-fine) drop-shadow(0 5px 8px rgba(60, 38, 16, 0.45));
  transform: rotate(0.8deg);
}

.paper .article-figure.is-print38 img {
  box-sizing: border-box;
  padding: 12px;
  background: #efe4c8;
  box-shadow: none;
  -webkit-mask: linear-gradient(#000 0 0) center/calc(100% - 10px) calc(100% - 10px) no-repeat, radial-gradient(circle, #000 3.2px, rgba(0, 0, 0, 0) 3.8px) -5px -5px/10px 10px round, linear-gradient(#000 0 0);
  -webkit-mask-composite: source-over, xor;
  mask: linear-gradient(#000 0 0) center/calc(100% - 10px) calc(100% - 10px) no-repeat, radial-gradient(circle, #000 3.2px, rgba(0, 0, 0, 0) 3.8px) -5px -5px/10px 10px round, linear-gradient(#000 0 0);
  mask-composite: add, exclude;
}

.paper .article-figure.is-print39 img {
  box-shadow: none;
  clip-path: polygon(22px 0, calc(100% - 22px) 0, calc(100% - 22px) 11px, calc(100% - 11px) 11px, calc(100% - 11px) 22px, 100% 22px, 100% calc(100% - 22px), calc(100% - 11px) calc(100% - 22px), calc(100% - 11px) calc(100% - 11px), calc(100% - 22px) calc(100% - 11px), calc(100% - 22px) 100%, 22px 100%, 22px calc(100% - 11px), 11px calc(100% - 11px), 11px calc(100% - 22px), 0 calc(100% - 22px), 0 22px, 11px 22px, 11px 11px, 22px 11px);
}

.paper .article-figure.is-print39.is-narrow img {
  clip-path: polygon(14px 0, calc(100% - 14px) 0, calc(100% - 14px) 7px, calc(100% - 7px) 7px, calc(100% - 7px) 14px, 100% 14px, 100% calc(100% - 14px), calc(100% - 7px) calc(100% - 14px), calc(100% - 7px) calc(100% - 7px), calc(100% - 14px) calc(100% - 7px), calc(100% - 14px) 100%, 14px 100%, 14px calc(100% - 7px), 7px calc(100% - 7px), 7px calc(100% - 14px), 0 calc(100% - 14px), 0 14px, 7px 14px, 7px 7px, 14px 7px);
}

.paper .article-figure.is-print40 img {
  box-sizing: border-box;
  padding: 16px;
  background: #efe4c8;
  box-shadow: none;
  -webkit-mask: linear-gradient(#000 0 0) center/calc(100% - 12px) calc(100% - 12px) no-repeat, radial-gradient(circle, #000 5.5px, rgba(0, 0, 0, 0) 6.1px) 0 0/12px 12px round;
  mask: linear-gradient(#000 0 0) center/calc(100% - 12px) calc(100% - 12px) no-repeat, radial-gradient(circle, #000 5.5px, rgba(0, 0, 0, 0) 6.1px) 0 0/12px 12px round;
}

/* ---------- .is-print41 - 50: more edges for the picture in its own colours ---------- */
.paper .article-figure.is-print41 img {
  box-shadow: none;
  filter: url(#paper-edge-deckle);
}

.paper .article-figure.is-print42 img {
  box-shadow: none;
  filter: url(#paper-edge-wash);
}

.paper .article-figure.is-print43 img {
  box-shadow: none;
  filter: url(#paper-edge-worn);
}

.paper .article-figure.is-print44 img {
  box-shadow: none;
  filter: url(#paper-edge-cut);
}

.paper .article-figure.is-print45 img {
  box-shadow: none;
  filter: url(#paper-edge-rim);
}

.paper .article-figure.is-print46 img {
  box-shadow: none;
  filter: url(#paper-edge-fringe);
}

.paper .article-figure.is-print47 img {
  box-shadow: none;
  filter: url(#paper-edge-halftone);
}

.paper .article-figure.is-print48 img {
  box-sizing: border-box;
  padding: 7px;
  border: 4px double #4a2f17;
  box-shadow: none;
  filter: url(#paper-line-rough);
}

.paper .article-figure.is-print49 img {
  box-shadow: none;
  clip-path: polygon(0 18px, 14px 0, 23% 0, 26% 7px, 34% 5px, 37% 0, 68% 0, 71% 4px, 78% 9px, 81% 0, calc(100% - 26px) 0, 100% 15px, 100% 31%, calc(100% - 8px) 36%, calc(100% - 5px) 44%, 100% 47%, 100% calc(100% - 22px), calc(100% - 12px) calc(100% - 9px), calc(100% - 30px) 100%, 61% 100%, 57% calc(100% - 8px), 49% calc(100% - 5px), 46% 100%, 17% 100%, 9% calc(100% - 6px), 12px calc(100% - 16px), 0 calc(100% - 30px), 0 62%, 7px 57%, 4px 51%, 0 48%);
}

.paper .article-figure.is-print50 img {
  box-sizing: border-box;
  padding: 14px;
  background: rgba(122, 82, 36, 0.08);
  border: 1px solid;
  border-color: rgba(60, 38, 16, 0.5) rgba(255, 248, 228, 0.8) rgba(255, 248, 228, 0.8) rgba(60, 38, 16, 0.5);
  box-shadow: inset 2px 2px 4px rgba(60, 38, 16, 0.22);
}

/* ========== 404 (view/<lang>/404.php) ========== */
.page-hero.not-found {
  height: auto;
  max-height: none;
  min-height: max(520px, 100vh - 144px);
  padding: 40px 0 calc(6.83vw + 40px);
}
.page-hero.not-found:after {
  background: radial-gradient(ellipse at center, rgba(10, 7, 4, 0.62) 0%, rgba(10, 7, 4, 0.8) 100%), linear-gradient(to bottom, rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.45));
}
.page-hero.not-found .page-hero-content {
  max-width: 720px;
  padding-top: 0;
}
.page-hero.not-found h1 {
  padding-left: 0.06em;
  font-size: clamp(120px, 19vw, 250px);
  line-height: 1;
  letter-spacing: 0.06em;
  font-variant-numeric: lining-nums;
  color: #c9a84c;
  background: linear-gradient(to bottom, #f3dc98 0%, #dfc070 32%, #b8963f 64%, #8f7030 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: none;
  filter: drop-shadow(0 3px 2px rgba(0, 0, 0, 0.85)) drop-shadow(0 10px 24px rgba(0, 0, 0, 0.7));
}
.page-hero.not-found .btn-outline {
  margin-top: 30px;
}

.not-found-title {
  position: relative;
}
.not-found-title:after {
  content: "";
  display: block;
  width: 240px;
  max-width: 70%;
  height: 1px;
  margin: 18px auto 0;
  background: linear-gradient(to right, transparent, #c9a84c 44%, transparent 44%, transparent 56%, #c9a84c 56%, transparent);
}
.not-found-title:before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -3px;
  width: 7px;
  height: 7px;
  margin-left: -3.5px;
  background: #c9a84c;
  transform: rotate(45deg);
}

.not-found .not-found-text {
  max-width: 560px;
  margin: 24px auto 0;
  font-family: "Roboto-Light";
  font-size: clamp(16px, 1.25vw, 19px);
  line-height: 1.65;
  color: #e3d3b4;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.9);
}

.page-band + .related {
  padding-top: 70px;
}
@media only screen and (max-width: 767px) {
  .page-band + .related {
    padding-top: 46px;
  }
}

html {
  scroll-behavior: smooth;
}

body {
  font-size: 16px;
  position: relative;
  font-family: "Roboto-Regular";
  background: #21201e url("/img/background-tile.webp") repeat left top;
  color: #000;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -ms-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}

.inner {
  width: 1256px;
  max-width: 94%;
  margin: 0 auto;
  position: relative;
}
.inner:after {
  content: "";
  display: table;
  clear: both;
}

.lang-wrap {
  font-family: "Roboto-Medium";
  font-size: 20px;
  position: absolute;
  top: 30px;
  right: 30px;
  z-index: 100;
}
.lang-wrap a {
  color: #fff;
  text-decoration: none;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -ms-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}
.lang-wrap a:hover {
  color: #c9a84c;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/*# sourceMappingURL=1-main.css.map */