/* colors */

:root {
  --olive: #A29522;
  --dark-olive: #766D19;
  --light-olive: #CABA2A;

  --pistache: #EBF0D7;
  --offwhite: #F6F8EF;
  --white: #FDFDFB;
  --black: #121212;

  --lemon: #EEFF8A;
  --neon: #E6FF55;

  --blue: #81B9B9;
  --light-blue: #C4DEDE;

  --orange: #FA862C;
  --pink: #FC6D6D;
  --light-pink: #FED2D2;
  --med-pink: #FDA0A0;
}

@keyframes fadeInAnimation {
  from {
      opacity: 0;
  }
  to {
      opacity: 1;
  }
}

/* general */

.container-jaca {
  width: 100%;
  padding-left: 36px;
  padding-right: 36px;
}

body {
  background-color: var(--pistache);
  animation: fadeInAnimation ease 0.8s;
  max-width: 100vw;
  overflow-x: hidden;
  font-family: "aktiv-grotesk", sans-serif;
}

a {
  text-decoration: none;
  color: var(--black);
  transition: 0.5s ease;
}

a:hover {
  transition: 0.5s ease;
  transform: translateY(-6px);
}

.move-hover {
  transition: 0.5s ease;
}

.move-hover:hover {
  transition: 0.5s ease;
  transform: rotate(10deg);
}


/* fonts */

@font-face {
  font-family: 'Spoof-Light';
  src:
  url('/wp-content/themes/jacanovo/fonts/Spoof-Light.woff') format('woff'),
  url('/wp-content/themes/jacanovo/fonts/Spoof-Light.woff2') format('woff2');
}

@font-face {
  font-family: 'Spoof-Bold';
  src:
  url('/wp-content/themes/jacanovo/fonts/Spoof-Bold.woff') format('woff'),
  url('/wp-content/themes/jacanovo/fonts/Spoof-Bold.woff2') format('woff2');
}

.degular {
  font-family: "degular-variable";
}

.fw5 {
  font-variation-settings: "wght" 600;
}

.fw6 {
  font-variation-settings: "wght" 600;
}

h1, h2, h3, h4, h5, h6, p, small {
  font-family: "degular-variable";
  color: var(--black);
}

h1 {
  font-size: 96px;
  line-height: 0.8;
}

h2 {
  font-size: 56px;
  line-height: 1;
}

h3, h3 p {
  font-size: 40px;
  line-height: 1;
}

h4, h4 p {
  font-size: 32px;
  line-height: 1;
}

h5, h5 p {
  font-size: 20px;
  line-height: 1.2;
}

h6, h6 p {
  font-size: 16px;
  line-height: 1.2;
}

p {
  font-size: 14px;
  line-height: 1.2;
}

.strong {
  font-family: "degular-variable";
  font-variation-settings: "wght" 600;
}


/* header */

header {
  width: 98%;
  height: 70px;
  border-radius: 35px;
  padding: 16px 64px;
  background-color: rgba(255, 255, 255, 0.5);
  position: fixed;
  top: 12px;
  left: 50%;
  transform: translateX(-50%);
  backdrop-filter: blur(16px);
  z-index: 99999;
}

header a p {
  margin-bottom: 0;
}

header.archive {
  top: 10px;
  height: 60px;
}

.modal {
  background-color: rgba(253, 253, 251, 0.5);
  backdrop-filter: blur(16px);
  cursor: pointer;
}

.modal-body {
  background-color: rgba(253, 253, 251, 0.5);
  backdrop-filter: blur(16px);
  border-radius: 20px;
  height: 40vh;
}

/* hero */

.hero {
  background-color: var(--pistache);
  width: 100vw;
  height: 120vh;
  transition: ease 0.5s;
  background-image: url(/wp-content/themes/jacanovo/assets/homebg.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  /* background-color: var(--white);
  -webkit-mask-image: url(/wp-content/themes/jacanovo/assets/homebg.svg) ;
  mask-image: url(/wp-content/themes/jacanovo/assets/homebg.svg);
  -webkit-mask: url(/wp-content/themes/jacanovo/assets/homebg.svg) no-repeat 100% 100%;
  mask: url(/wp-content/themes/jacanovo/assets/homebg.svg) no-repeat 100% 100%;
  -webkit-mask-size: contain;
  mask-size: contain; */
}

.hero.scrolled {
  transition: ease 0.5s;
  background-image: url(/wp-content/themes/jacanovo/assets/homebgscrolled.svg);
}

.hero-info {
  position: absolute;
  bottom: 0;
  left: 0;
}

.hero h4 {
  width: 500px;
}

.bg-pistache {
  background-color: var(--pistache);
  transition: ease 0.5s;
}

.bg-olive {
  background-color: var(--olive);
  transition: ease 0.5s;
}

.bg-blue {
  background-color: var(--blue);
}

.bg-lemon {
  background-color: var(--lemon);
}

.bg-darkolive {
  background-color: var(--dark-olive);
}

.bg-pink {
  background-color: var(--pink);
}

.bg-medpink {
  background-color: var(--med-pink);
}

.bg-orange {
  background-color: var(--orange);
}

.bg-offwhite {
  background-color: var(--offwhite);
}

.bg-lightblue {
  background-color: var(--light-blue);
}

.bg-lightpink {
  background-color: var(--light-pink);
}

.text-white {
  color: var(--offwhite);
}

/* home */


.carousel-posts {
  background-color: var(--offwhite);
  border-radius: 20px;
  padding: 40px;
  margin-top: 40px;
  padding-bottom: 112px;
}

.carousel-cell p, .carousel-cell h5 {
  margin:0;
}

.carousel-cell {
  width: 42%;
  margin-right: 20px;
}

.carousel-cell.cell-lc {
  width: 30%;
  margin-right: 16px;
}

.carousel-cell-tags {
  font-family: "degular-variable";
  font-size: 14px;
}

.carousel-cell-title {
  height: 200px;
}

.carousel-cell-box {
  background-color: var(--white);
}

/* buttons */

.btn-classic {
  width:fit-content;
  padding: 12px 16px;
  border-radius: 40px;
  background-color: var(--neon);
  cursor: pointer;
  margin-top: 24px;
  transition: ease 0.5s;
}

.btn-classic p {
  margin:0;
}

.btn-classic:hover {
  transform: translateY(-6px);
  transition: ease 0.5s;
}

.grid-3fr {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  column-gap: 20px;
  background-color: var(--offwhite);
}

.grid-4fr {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  column-gap: 20px;
  background-color: var(--offwhite);
}

.grid-box {
  border: 1pt solid var(--pink);
  background-image: linear-gradient(to top, var(--orange) 50%, transparent 50%);
  background-size: 100% 200%;
  background-position: top;
  transition: background-position 0.5s ease-in-out;
}

.grid-box.box-lc {
  background-image: linear-gradient(to top, var(--med-pink) 50%, transparent 50%)!important;
}

.grid-box img {
  width: 60%;
  height: 60%;
  object-fit: cover;
}

.grid-box:hover {
  transition: ease 0.5s;
  background-position: bottom;
}

.embed-container {
  position: relative;
  padding-bottom: 56.25%;
  overflow: hidden;
  max-width: 100%;
  height: auto;
}

.embed-container iframe,
.embed-container object,
.embed-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.home-criancas {
  height: 100vh;
  background-image: url(/wp-content/themes/jacanovo/assets/criancasbg.svg);
  background-repeat: no-repeat;
  background-size:contain;
  background-position: center;
}

.hero-criancas {
  width: 100vw;
  height: 100vh;
  background-image: url(/wp-content/themes/jacanovo/assets/criancaspg.svg);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}
.hero-criancas h1 {
  font-size: 20vw;
  line-height: 0.9;
  margin-bottom: 0px;
  text-transform: uppercase;
  color:#FB3C3C;
}
.grid-criancas div {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: top;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  padding: 16px;
}
.grid-criancas a {
  border: 1pt solid black;
  padding: 12px 20px;
  border-radius: 100px;
  width:fit-content;
}

.home-lugarcriacao {
  background-image: url(/wp-content/themes/jacanovo/assets/biscoito-pink.svg);
  background-repeat: no-repeat;
  background-size:60%;
  background-position: center;
  height: 54vw;
}

.home-convite {
  background-image: url(/wp-content/themes/jacanovo/assets/biscoito-azul.svg);
  background-repeat: no-repeat;
  background-size:70%;
  background-position: center;
  height: 32vw;
}

.home-publi {
  background-image: url(/wp-content/themes/jacanovo/assets/biscoito-verde.svg);
  background-repeat: no-repeat;
  background-size:50%;
  margin-top: 24px;
  height: calc(22vw - 24px);
}

footer {
  border-radius: 24px 24px 0px 0px;
}

.lugarcriacao-hero {
  border-radius: 0px 0px 24px 24px;
  background-image: url(/wp-content/themes/jacanovo/assets/lugarcriacaobg.svg);
  height: 50vh;
  background-size: cover;
  background-position: bottom;
}

.convite-hero {
  border-radius: 0px 0px 24px 24px;
  background-image: url(/wp-content/themes/jacanovo/assets/convitebg.svg);
  height: 50vh;
  background-size: cover;
  background-position: bottom;
}

.publi-hero {
  background-image: url(/wp-content/themes/jacanovo/assets/biscoito-verde.svg);
  border-radius: 0px 0px 24px 24px;
  height: 50vh;
  background-size: cover;
  background-position: bottom;
}

.patri-hero {
  border-radius: 0px 0px 24px 24px;
  background-image: url(/wp-content/themes/jacanovo/assets/patribg.svg);
  height: 50vh;
  background-size: cover;
  background-position: bottom;
}

.solid-hero {
  border-radius: 0px 0px 24px 24px;
  height: auto;
  padding-top: 120px;
}

.grid-box.b--orange {
  border: 1pt solid var(--orange);
}

.gradient-square {
  width: 100%;
  margin-bottom: 16px;
 }

 .gradient-square h3 {
  font-size: 20px;
 }

 .gradient-square01 {
  /* background-image: url("/wp-content/themes/jaca/assets/gradient01.svg"); */
  border-radius: 20px;
  background-color: var(--blue);
 }
 .gradient-square02 {
  /* background-image: url("/wp-content/themes/jaca/assets/gradient02.svg"); */
  border-radius: 20px;
  background-color: var(--lemon);
 }
 .gradient-square03 {
  /* background-image: url("/wp-content/themes/jaca/assets/gradient03.svg"); */
  border-radius: 20px;
  background-color: var(--med-pink);
 }
 .gradient-square04 {
  /* background-image: url("/wp-content/themes/jaca/assets/gradient04.svg"); */
  border-radius: 20px;
  background-color: var(--orange);
 }
 .gradient-square05 {
  /* background-image: url("/wp-content/themes/jaca/assets/gradient05.svg"); */
  border-radius: 20px;
  background-color: var(--pink);
 }
 .gradient-square06 {
  /* background-image: url("/wp-content/themes/jaca/assets/gradient06.svg"); */
  border-radius: 20px;
  background-color: var(--light-olive);
 }
 .gradient-square07 {
  /* background-image: url("/wp-content/themes/jaca/assets/gradient07.svg"); */
  border-radius: 20px;
  background-color: var(--light-blue);
 }
 .gradient-square08 {
  /* background-image: url("/wp-content/themes/jaca/assets/gradient08.svg"); */
  border-radius: 20px;
  background-color: var(--pistache);
 }
 .gradient-square09 {
  /* background-image: url("/wp-content/themes/jaca/assets/gradient09.svg"); */
  border-radius: 20px;
  background-color: var(--light-pink);
 }

 .grad {
  /* background-image: linear-gradient(to bottom, #81B9B9, #E6FF55); */
  position: relative;
}

.dupla-line {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
}

.grad.natureza-e-cultura{
  /* background-image: linear-gradient(to bottom, #81B9B9, #E6FF55); */
  background-color: var(--blue);
}

.grad.memoria-e-futuro{
  background-color: var(--lemon);
  /* background-image: linear-gradient(to bottom, #FC6D6D, #E6FF55); */
}

.grad.arte-e-tecnologia{
  background-color: var(--med-pink);
  /* background-image: linear-gradient(to bottom, #F5FFBD, #81B9B9); */
}

.grad.experimentacao-e-imaginacao{
  background-color: var(--orange);
  /* background-image: linear-gradient(to bottom, #CABA2A, #FC6D6D); */
}

.grad.corpo-e-coletivo{
  /* background-image: linear-gradient(to bottom, #CABA2A, #E6FF55); */
  background-color: var(--pink);
}

.grad.escrita-e-oralidade{
  background-color: var(--light-olive);
  /* background-image: linear-gradient(to bottom, #EF6C06, #FC6D6D); */
}

.grad.cidade-e-museu{
  background-color: var(--light-blue);
  /* background-image: linear-gradient(to bottom, #FC6D6D, #A6DADA); */
}

.grad.trabalho-e-brincadeira{
  background-color: var(--olive);
  /* background-image: linear-gradient(to bottom, #EF6C06, #EEAB9A); */
}

.grad.imagem-e-som{
  /* background-image: linear-gradient(to bottom, #A6DADA, #CABA2A); */
  background-color: var(--light-pink);
}
 .video iframe {
  height: 100%!important;
  width: 100%!important;
  aspect-ratio: 16 / 9!important;
  border-radius: 20px;
}
.post-hero p {
  margin:0;
  margin-bottom: 8px;
}
.post-r-column {
  width: 260px;
}
.post-content p {
  font-size: 20px;
  line-height: 1.35;
  font-family: "aktiv-grotesk", sans-serif;
  font-weight: 400;
}

.post-content p strong {
  font-size: 24px;
  font-family: "degular-variable";
  font-variation-settings: "wght" 600;

}

.post-content h2 {
  font-size: 32px;
  text-transform: uppercase;
  margin-top: 40px;
  margin-bottom: 24px;
  font-family: 'Spoof-Bold';
  font-family: "degular-variable";
  font-variation-settings: "wght" 600;
}
.link-out-box {
  width: 200px;
  height: 200px;
  border-radius: 20px;
  box-shadow: 2px 2px 10px rgb(200,200,200);
  padding: 16px;
  background-color: var(--light-olive);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.link-out-box-txt {
  width: 200px;
}

.link-out-box img {
  width: 12px;
  text-align: end;
}

.link-out-box.bg-lightblue {
  background-color: var(--light-blue);
}

.box-shadow-light {
  box-shadow: 2px 2px 10px rgb(200,200,200);
}

.materiais-box div.w-50{
  background-image: url(/wp-content/themes/jacanovo/assets/biscoito-neon.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.materiais-box ul li {
  margin-top: 16px;
}

.carousel-cell-box {
  position: relative;
  border-radius: 10px;
}

.thumbnail-cell {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0;
  object-fit: cover;
  object-position: center;
  border-radius: 10px;
  transition: ease 0.3s;
  z-index: 999;
  filter: grayscale(100%);
  opacity: 0;
  pointer-events: none;
  mix-blend-mode: multiply;
}

.thumbnail-cell-vt {
  width: 100px;
  height: 100px;
  object-fit: cover;
  object-position: center;
  border-radius: 6px;
  filter: grayscale(100%);
  pointer-events: none;
  background-blend-mode: multiply!important;
  /* display: -webkit-box;
  margin-left: auto; */
}

/* .thumbnail-cell.archive-cell {
  top: 8px;
  width: 180px;
  height: 180px;
} */

.carousel-cell-box {
  background-image: linear-gradient(to top, var(--light-olive) 50%, transparent 50%);
  background-size: 100% 200%;
  background-position: top;
  transition: background-position 0.5s ease-in-out; /** I've changed the time for demo purposes **/
}

.archive .carousel-cell-box {
  background-image: linear-gradient(to top, var(--pistache) 50%, transparent 50%);
}

/* .carousel-cell-box:hover {
  background-position: bottom;
} */

.carousel-cell-box:hover .thumbnail-cell {
  transition: ease 0.3s;
  opacity: 0.9;
  height: 100%;
  /* background-blend-mode: multiply!important; */
}

/* arquivo */


.box-title-arquivo {
  height: 180px;
}

.arquivo-box-title {
  height: 160px;
}

.arquivo-column {
  height: 99vh;
  overflow: scroll;
  padding-bottom: 100px;
}

.arquivo-column::-webkit-scrollbar{
  display: none;
}
.archive ul li:first-child {
  white-space: nowrap;
  position: relative;
}
.archive ul li:first-child::after {
  content: url('/wp-content/themes/jacanovo/assets/lupa.svg');
  display: inline-block!important;
  width: 18px!important;
  height: 18px!important;
  position: absolute;
  top: 30%;
  right: 20px;
  cursor: pointer;
}
.archive {
  font-family: "degular-variable", sans-serif;
  margin-top: 6rem;
}
/* .archive-campos {
  position: sticky;
  top: 6rem;
  z-index: 999;
  background-color: white;
} */


/* search and filter */

.searchandfilter {
  width: 100%;
}

.searchandfilter ul li {
  display: inline-block;
}

.searchandfilter ul {
  padding: 0;
  margin: 0;
}

.sf-field-reset {
  position: absolute;
  top: -50px;
  right: 0px;
  background-image: url(../assets/close.svg);
  background-repeat: no-repeat;
  background-size: 20px;
  cursor: pointer;
  background-position: center;
  background-color: white;
  border-radius: 40px;
  color: rgba(0,0,0,0)!important;
}

.search-filter-reset {
  color: white;
  padding: 10px 6px;
  border: 1pt solid black;
  border-radius: 40px;
  color: rgba(0,0,0,0)!important;
}


[data-sf-count="0"] {
  color: var(--light-olive);
  text-decoration:line-through;
}


.sf-field-search label {
  width: 95%;
}

.sf-field-category label select,
.sf-field-tag label select,
.sf-field-post-meta-ano label select,
.sf-field-post-meta-cidade label select,
.sf-field-post-meta-instituicao label select,
.sf-field-search label input {
  border-radius: 0;
  border: 1pt solid black;
  height: 32px;
  text-transform: uppercase;
  font-family: "degular-variable";
  padding-left: 2px;
  font-size: 13px;
  width: 100%;
  display: inline-block;
  margin-bottom: 8px;
}

::placeholder {
  color: black;
  opacity: 1; /* Firefox */
  margin-left: 3px;
}

.sf-field-category,
.sf-field-post-meta-ano,
.sf-field-post-meta-cidade,
.sf-field-post-meta-instituicao,
.sf-field-tag,
.sf-field-search {
  width: 20%;
}

.sf-field-category label,
.sf-field-post-meta-ano label,
.sf-field-post-meta-cidade label,
.sf-field-post-meta-instituicao label,
.sf-field-tag label {
  width: 100%;
  display: inline-block;
}

.sf-field-category label,
.sf-field-tag label,
.sf-field-post-meta-instituicao label {
  padding-right: 12px;
}

.sf-field-category label select:focus,
.sf-field-post-meta-ano label select:focus,
.sf-field-post-meta-cidade label select:focus,
.sf-field-post-meta-instituicao label select:focus,
.sf-field-search label input:focus,
.sf-field-tag label:focus {
  border-radius: 0;
  outline: none;
}




/* .sf-field-tag label select, */
/* .sf-field-post-meta-guests label select {
  height: 55vh;
  border: none;
  background-color: transparent;
  padding-right: 24px;
  border-radius: 0;
  padding-top: 16px;
  width:100%;
} */

/* .sf-field-tag, */
.sf-field-post-meta-guests {
  display: none!important;
  /* width: 48%;
  border-top: 1pt solid black;
  margin-top: 8px; */
}

/* .sf-field-tag h4 {
 padding-left:24px;
}

.sf-field-tag label,
.sf-field-post-meta-guests label {
  width: 100%;
  display: inline-block;
}

.sf-field-tag label select {
  padding-left: 24px;
  border-left: 1px solid black;
} */

/* .sf-field-tag option, */
/* .sf-field-post-meta-guests option {
  font-family: "degular-variable";
  font-size: 20px;
} */

/* .sf-field-tag option:hover, */
/* .sf-field-post-meta-guests option:hover {
  color: var(--dark-olive);
  font-variation-settings: "wght" 600;
  cursor: pointer;
} */

/* .sf-field-tag option:checked, */
/* .sf-field-post-meta-guests option:checked {
  background-color: #E6FF55;
} */

/* .sf-field-tag label select:focus, */
/* .sf-field-post-meta-guests label select:focus {
  outline: none;
} */
/*
.sf-field-tag option:focus {
  background-color: #E6FF55;
  background: #766D19;
} */


/* .sf-field-tag label select::-webkit-scrollbar, */
/* .sf-field-post-meta-guests label select::-webkit-scrollbar {
  display: none;
} */

::selection {
  background: #E6FF55;
}

.cobra {
  width: 100vw;
  height: 800vh;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 999;
  background-blend-mode: multiply;
  pointer-events: none;
  opacity: 90%;
}

.mobile {
  display: none;
}

/* educacao patrimonial */

.accordion-button,
.accordion-item,
.accordion-header {
  background-color: transparent!important;
  color: black!important;
}

.accordion-button:not(.collapsed) {
  box-shadow: none!important;
  color: black!important;
}

.accordion-item {
  border: none!important;
}

.accordion-item:last-child {
  border-bottom: 1pt solid black!important;
}

.accordion-item h1 {
  margin-top: 0;
}

.lista-nomes {
  overflow-y: scroll;
}

@media (max-width: 1024px) {
  .mobile {
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    width: 100vw;
    height: 100vh;
    z-index: 999999;
    background-color: rgba(253, 253, 251, 0.5);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px) !important;
    -moz-backdrop-filter: blur(16px) !important;
    backdrop-filter: blur(16px) !important;
  }
  .blur {
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
    }
}
