    * {
  box-sizing: border-box;
}

.content.words
{
	z-index : 9998;
	z-index : auto;
}

.hero .hero__fullsize > .content.words:first-child
{
	z-index : 3;
}

.hero {
  --border-radius: 12px;
  --transition-duration: 1000ms;
  position: relative;
  width: 100%;
  height: 100vh;
  
  height : 763px; /* k2 BWD */
}

.hero__fullsize {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: 0;
}

.hero__content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  filter: drop-shadow(0 5px 5px #0007);
  transition:
    top var(--transition-duration), 
    left var(--transition-duration), 
    width var(--transition-duration), 
    height var(--transition-duration),
    border-radius var(--transition-duration),
    transform var(--transition-duration),
    opacity var(--transition-duration);
}

.hero__content--hidden {
  visibility: hidden;
  transition: none;
  transform: none;
  opacity: 1;
  z-index: 0;
}

.hero__content--bottom {
  opacity: 0;
  transform: scale(1.5);
  z-index: 1;
}

.hero__content--top {
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: 0;
  z-index: 2;
}

/* curtain */

.hero__content--show-text::before {
  transform: translateX(0);
  transition: transform 300ms;
}

.hero__content--grow::before {
  transform: translateX(-100%);
  transition: none;
}

/* title */
.hero__content--show-text .content__title {
  transform: translateY(0);
  transition: transform 300ms;
}

.hero__content--show-text .content__title .word {
  clip-path: inset(0);
  transition: clip-path 300ms;
}

.hero__content--grow .content__title {
  visibility: hidden;
  transform: translateY(48px);
  transition: none;
}

.hero__content--grow .content__title .word {
  clip-path: inset(0 0 48px);
  transition: none;
}

/* desc */

.hero__content--show-text .content__desc {
  transform: translateY(0px);
  transition: transform 300ms;
}

.hero__content--show-text .content__desc .word {
  clip-path: inset(0);
  transition: clip-path 300ms;
}

.hero__content--grow .content__desc {
  visibility: hidden;
  transform: translateY(18px);
  transition: none;
}

.hero__content--grow .content__desc .word {
  clip-path: inset(0 0 18px);
  transition: none;
}

.hero__swiper {
  position: absolute;
  width: 70%;
  aspect-ratio: 2.5 / 1;
  right: 0px;
  bottom: 50px;
  padding: 15px 0;
  z-index: 1;
  user-select: none;
}

.swiper {
  --swiper-navigation-size: 20px;
  visibility: hidden;
}

.swiper.swiper-initialized {
  visibility: visible;
}

.swiper-slide-prev,
.swiper-slide-active {
  opacity: 0;
}

.swiper-slide {
  display: flex;
}

.content {
  display: flex;
  position: relative;
  width: 100%;
  filter: drop-shadow(0 5px 5px #0007);
  overflow: hidden;
  z-index: 0;
}

.content--slide {
  position: relative;
  /* border-radius: var(--border-radius, 0); */
  
  border-width : 15px;
  border-style : solid;
  border-color : #FFF;
}

.content__text {
  display: flex;
  flex-direction: column;
  width: 100%;
  color: #fff;
}

.content__desc {
  margin: 0;
}

.content--slide .content__title {
  font-size: 12px;
  margin: auto 0 0;
  padding: 0.35em 0.75em;
  background-color: #0007;
}

.content--slide .content__desc {
  position: absolute;
  left: 0;
  visibility: hidden;
}

.content--hero {
  padding: 100px 50px 0;
  position: absolute;
  border-radius: 0;
}

.content--hero::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, hsl(49deg 70% 5% / 67%), transparent);
  pointer-events: none;
  z-index: -1;
}

.content--hero .content__title {
  font-size: 42px;
  margin: 0 0 0.2em;
}

.content--hero .content__text {
  width: 45%;
}

.content__image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -2;
}

.swiper-button-next {
  right: auto !important;
  left: calc((100% - 25px * 2) / 3.5);
  top: calc(50% - 20px) !important;
  width: 40px;
  height: 40px;
  background-color: #fffb;
  border-radius: 50%;
  /* color: forestgreen; */
  color : red;
}

.swiper-slide.swiper-slide-duplicate .content__text p:last-child
{
	display : none;
}

/*******************/
/* BWD starts here */
/******************/

.content--slide .content__title
{
	display : table;
	
	min-height : 100px;
	
	color : #FFF;
	
	font-family : "Rosie Brown Serif", sans-serif;
	font-weight : 400;
	font-size : 36px;
	text-transform : uppercase;
}

.content--hero .content__title
{
	color : #FFF;
	
	font-family : 'Rosie Brown Serif';
	font-size : 74px;
	line-height : 76px;
	text-transform : uppercase;
}

.content__text
{
	position : absolute;
	bottom : 150px;
}

.hero__swiper .content__text
{
	bottom : 0px;
}

.content__desc
{
	color : #FFF;
	
	font-family : 'muli', sans-serif;
	font-size : 24px;
	
}

.content__desc p
{
	font-family : 'muli', sans-serif;
	font-size : 24px;
}

.content__desc p span,
#hp_events > div > div.hero__fullsize > div.content.words.splitting.hero__content.content--hero.hero__content--top > div > p > span:nth-child(1)
{
	display : inline-block;
	
	color : #f0daa3;
	
	padding-bottom : 10px;
	
	font-family : "baskerville-display-pt";
	font-size : 30px;
}

.content--slide .content__title span
{
	display : table-cell;
	vertical-align : middle;
}

.content__desc a.button
{
	display : inline-block;	
	
	color : var(--cantate-gold);
	
	margin-top : 15px;	
	
	border-color : var(--cantate-gold);
	
	z-index : 9999;
}

.content__desc .button.arrow.medium
{
	padding : 7px 45px 7px 45px;
}

.content__desc .button.arrow.medium:after
{
	width : 38px;
	height : 38px;
	
	top : -2px;
}

.content__desc a.button.arrow:after
{
	background : var(--cantate-gold);
}

.content--hero::before
{
	background : linear-gradient(90deg, hsl(49deg 70% 5% / 87%), transparent);
}

div.slide_btn
{
	position : relative;
	
	background : pink;
	
	width : 300px;
	height : 50px;
}

div.slide_btn a
{
	background : pink;
	
	position : absolute;
	
	top : 0px;
	left : 0px;
	
	with : 300px;
	height : 300px;
}

@media only screen and (min-width : 2200px)
{
	.hero__swiper
	{
		width : calc(55% + 1.5vw)
	}
	
	.content--slide .content__title
	{
		color : #FFF;
		
		font-size : 36px;
	}
}

@media only screen and (min-width : 1626px)
{
	.hero
	{
		height : 950px;
	}
		
	.hero__swiper
	{
		width : calc(55% + 14.5vw)
	}
}


@media only screen and (max-width : 1600px)
{
	.content--slide .content__title
	{
		font-size : 24px;
	}
}



@media only screen and (max-width : 909px)
{
	.hero
	{
		height : 750px;
	}

	.content--slide
	{
		border-width : 5px;
	}
	
	.content--hero .content__title
	{
		font-size : calc(9vw);
		line-height : calc(8.5vw);
	}
	
	.content--slide .content__title
	{
		font-size : 14px;
	}
	
	.content--hero
	{
		padding : 100px 30px 0px;
	}
	
	.content--hero .content__text
	{
		width : calc(100% - 60px);
	}
	
	.content--hero .content__text
	{
		background : rgba(0, 0, 0, .5);
		
		padding : 10px;
		
		bottom : calc((100vw * .0516) + 269px);
	}
	
	.content__desc
	{
		font-size : 20px;
		line-height : 24px;
	}
	
	#hp_events > div > div.hero__fullsize > div.content.words.splitting.hero__content.content--hero.hero__content--top > div > p > span:nth-child(1)
	{
		line-height : 32px;
	}

	
	.hero__swiper
	{
		width : calc((100vw * .6) + 148.38px);
	}
		
}

@media only screen and (max-width : 600px)
{
	.hero
	{
		height : 650px;
	}
	
	.content--hero .content__text
	{
		bottom : calc((100vw * .0516) + 211px);
		
		padding : 30px;
	}
	
	.content--hero .content__title
	{
		font-weight : 600;
		letter-spacing : 2px;
	}
	
	.hero__swiper
	{
		width : 127%;
		
		bottom : 25px;
	}
	
	.swiper-wrapper .content--slide .content__title
	{
		font-family : 'muli', sans-serif;
	}
	
	.content__desc
	{
		font-size : 16px;
	}
}