:root{
  --blackish: #151515;
  --maincolor: #19191d;
	--maincolordarker: #19191d;
	--textcolor: #ebdfc8;
	--strongcolor: #87925f;
	--offcolor: #c0b4a0;
	--oncolor: #f3ebdd;
}

*{
  box-sizing:border-box;
  -webkit-font-smoothing: subpixel-antialiased;
  text-rendering: geometricPrecision;
}

h1,h2,h3,h4,h5,p{
  color:whitesmoke;
}

hr{
  border:0.5px solid silver;
}

html{
  font-size:16px;
  scroll-behavior:smooth;
  overflow-x:hidden;
  font-family: "new-rubrik-edge", sans-serif;
  background:var(--maincolor);
}

body{
  padding: 0rem;
  margin:0;
  background:var(--maincolor);
  width:100vw;
  overflow-x:hidden
}

.tw23-contact-info-wrap {
    display: grid
;
    grid-template-columns: 1fr;
    gap: 1rem;
    padding: 0 1.618rem;
    width: fit-content;
    margin: auto;
    margin-bottom: 4.236rem;
}

.tw23-contact-info-wrap a {
    display: flex
;
    align-items: center;
    grid-gap: 1rem;
    text-decoration: none;
    font-weight: 300;
    color:#fff7e6
}

.tw23-contact-info-wrap a svg {
    background: linear-gradient(235deg, rgb(255 255 255 / 18%) 0%, rgb(255 255 255 / 15%) 50%, rgb(255 255 255 / 1%) 100%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    outline: 1px solid #ffffff24;
    aspect-ratio: 1;
    padding: 0.618rem;
    border-radius: 100px;
}

.tw23-contact-info-wrap a svg path{
  fill:#ebe0c9!important
}

.cc-intro-sec{
  width:100vw;
  height:100dvh;
  background:var(--maincolor);
  background-image: linear-gradient( 179deg, rgba(0,0,0,1) 9.2%, rgb(39 37 44) 103.9% );
  display:block;
}

.cc-intro-wrap{
  width:100%;
  height:100dvh;
  display:block;
  position: relative;
  padding:0.25rem 2rem;
}

.cc-intro-title{
  text-align:center;
  font-size:2rem;
  font-weight:400;
  font-family: "scotch-text", sans-serif;
  color:#EBDFCA;margin: 1.5rem 0;margin-top:5rem
}

.cc-mininav-sec{
  position: fixed;
	width: 100vw;
	z-index: 999;
  background-size: 0.25rem 0.25rem;
  background-color: #171717d6;
	background-image: repeating-linear-gradient(45deg, #d0d0d030 0, #d0d0d03b 0.5px, #e5e5f700 0, #e5e5f700 50%);
	box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
}

.cc-mininav-wrap{
		margin: 0 auto;
	display: flex;
	justify-content: space-between;
	border: 0px solid
color-mix(in oklab, var(--offcolor), transparent 70%);
	padding: 1rem 1.5rem;
	border-radius: 0px;
	opacity: 1;
	max-width:375px;
  justify-content: center
}

.cc-mininav-wrap a{
  color:#EBDFCA;
  text-decoration:none;
	  font-family: "scotch-text-condensed", sans-serif;
	font-weight: 400;
  display:flex;
  grid-gap:0.5rem;
  align-items:center;
  cursor:pointer;
  font-size: 1.25rem;
}

.cc-contact-wrap{
	width: 350px;
	height: auto;
	background: #050506;
	display: flex;
	flex-direction: column;
	padding: 1.75rem;
	grid-gap: 0.5rem;
	/* border-radius: 0.5rem; */
	outline: 0px solid
color-mix(in oklab, var(--offcolor), transparent 40%);
	outline-offset: 2px;
	position: absolute;
	top: 1rem;
	left: -1rem;
	transform: translateX(-100%);
	backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
	z-index: 999;
	background-size: 0.25rem 0.25rem;
	background-image: repeating-linear-gradient(45deg, #d0d0d030 0, #d0d0d03b 0.5px, #e5e5f700 0, #e5e5f700 50%);
	outline: 1px solid #3b3b3b;

	background: linear-gradient( 179deg, rgb(0 0 0 / 30%) 9.2%, rgb(39 37 44 / 55%) 103.9% );
  background-size: 0.25rem 0.25rem;
  background-color: #171717d6;
  background-image: repeating-linear-gradient(45deg, #d0d0d030 0, #d0d0d03b 0.5px, #e5e5f700 0, #e5e5f700 50%);
}

.cc-contact-close {
  border: none;
  background: none;
  font-size: 1.75rem;
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
  color: var(--offcolor);
  transition: all 0.3s ease;
  padding: 0;
}

.cc-contact-close:hover{
  transform:scale(1.2)
}

.cc-contact-wrap h2{
  margin:0;
  font-weight:400;
  display: flex;
	justify-content: space-between;
  color:var(--textcolor);
  font-family:"scotch-text", sans-serif;
  margin-bottom:0.35rem
}

.cc-contact-wrap a{
  font-size:0.8rem;
  color:var(--maincolor);
  text-decoration:none;
  display:flex;
  grid-gap:1rem;
  align-items:center;
  color:var(--textcolor);
  font-family: "new-rubrik-edge", sans-serif;
}

.cc-contact-wrap p{
  font-size: 0.8rem;
	font-weight: 300;
	color: var(--maincolordarker);
	color: var(--textcolor);
	margin-bottom: 0;
	margin-top: 0.5rem;
	line-height: 1.25rem;
}

.cc-info-wrap{

	max-width: 45ch;
	margin: 0 auto;
	position: relative;
	padding: 0 1rem;
	margin-top: 2rem;
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
}

.cc-info-wrap:after {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	height: 70%;
	width: 2px;
	background: #817e5c;
}

.cc-info-wrap:before {
  content: '';
	position: absolute;
	left: -4px;
	top: 0;
	height: 10px;
	width: 10px;
	background: #817e5c;
  border-radius:100px
}

.cc-info-wrap > p:first-child{
  margin:0
}

.cc-info-wrap > p{
  color: var(--oncolor);
	text-align: justify;
	margin: 0 auto;
	margin-top: 1rem;
	font-size: 0.85rem;
	line-height: 1.25rem;
  font-weight:300;

}


.tw23-home-cc-svg-wrap{

 overflow-x:hidden;
  height: fit-content;
  display: flex;
  width: 70vw;
  max-width:400px;
	margin: 0 auto;
  margin-top:2rem
}

.tw23-home-cc-svg-wrap svg:nth-child(1){
  transform: translateX(70%);
  transform-origin: center;
}

.tw23-home-cc-svg-wrap svg:nth-child(2){
  transform: translateX(-70%);
  transform-origin: center;
}

.cc-scroll-icon-wrap{
  display: block;
	width: 40px;
	height: 75px;
	border: 1px solid silver;
	border-radius: 50px;
	position: absolute;
	bottom: 1rem;
		left: 50%;
	transform: translateX(-50%)!important;

}

.cc-scroll-icon-wrap:before {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	background: var(--maincolor);
	border-radius: inherit;
}

.cc-scrollball{
  display:block;
  width:8px;
  height:8px;
  background:var(--offcolor);
  position:absolute;
  top:10px;
  left:50%;
 opacity:0;
  border-radius:100px;
}

@property --gradient-angle {
  syntax: "<angle>";
  initial-value:0deg;
  inherits:false;
}


.glowscroll{

  transform:translateZ(0)
}


.glowscroll:after {
   content: '';
	position: absolute;
	top: -2px;
	left: -2px;
	width: calc(100% + 4px);
	height: calc(100% + 4px);
	z-index: -1;
	background-size: 100%;
	/* background-image: conic-gradient(from var(--gradient-angle),rgb(17, 24, 39), rgb(75, 85, 99),rgb(17, 24, 39)); */
	background-image: conic-gradient(from var(--gradient-angle),var(--strongcolor), var(--maincolor),var(--strongcolor));
	border-radius: inherit;
	animation: glowanimscroll 2s linear infinite;
	opacity: 1;


}





@keyframes glowanimscroll{
  0%{
	--gradient-angle: 0deg;
  }
  100%{
	--gradient-angle: 360deg;
  }
}


.cc-gallery-sec{
  width:100%;
  min-height:100dvh;
  background:var(--blackish);
  padding:0;
  position:relative;
  background-image: linear-gradient( 0deg, rgba(0,0,0,1) 9.2%, rgb(39 37 44) 103.9% );
}

.cc-gallery-sec:after {
  content:'GALLERY';
  position:absolute;
  top:1rem;
  left:50%;
  font-size:3.3rem;
  transform:translate(-50%, 0);
  z-index:-1;
}

.cc-gallery-wrap{
  display:grid;
  width:100%;
  grid-template-columns: repeat(auto-fit, minmax(200px,1fr));
  grid-gap:1rem;
  padding:1rem 2rem;

}

.cc-image-wrap{
  display:flex;
  width:100%;
  position:relative;
  transition:scale 0.3s ease;
  opacity:0;
  border-radius: 1rem;
  overflow: hidden;
}

.cc-image-wrap:after{
  content:'';
  padding-bottom:100%;
}

.cc-image-wrap:hover{

}

.cc-image-wrap img{
  width:100%;
  height:100%;
  object-fit:cover;
  position:absolute;
  top:0;
  left:0;
}

.cc-image-wrap:before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  display:block;
  background:black;
  z-index:100;
  mix-blend-mode: color;

}

.cc-window-sec{
  display:grid;
  position:fixed;
  width:100vw;
  height:100dvh;
  top:0;
  left:0;
  background:black;
  z-index:999;
  display:none;
  grid-template-columns:1fr 1fr;
}

.cc-image-master-wrap .cc-image-wrap:before{
  display:none;
}

.cc-wimage-wrap{
  width:100%;
  height:100%;
  position:absolute;
  top:0;
  left:0;
  opacity:0;
  border-radius:0;
}

.cc-wimage-wrap img{
  object-fit:cover
}

.cc-window-button{
  position: absolute;
	top: 1rem;
	left: 1rem;
	z-index: 999;
	width: 3rem;
	height: 3rem;
	font-size: 1.5rem;
	font-weight: 600;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 100px;
	border: none;
	background: #e53333;
	color: white;
  transition:all 0.3s ease;
}

.cc-window-button span{
  font-size:1.5rem
}

.cc-window-button:hover{
  transform:scale(0.9)
}

.cc-master-wrap{
  display:flex;
}

.cc-doc-wrap{
  position:absolute;
  top:0;
  left:0;
  padding:3rem 3.236rem;
  border:0px solid silver;
 height:100%;
 width:100%;
  opacity:0;
  display:flex;
  flex-direction:column;
  overflow-y:scroll;
  background-image: linear-gradient( 179deg, rgba(0,0,0,1) 9.2%, rgb(39 37 44) 103.9% );
}

.cc-doc-wrap h2{
  margin:0;
  font-family: "scotch-text", sans-serif;
  color:#EBDFCA;
  font-weight:400
}

.cc-doc-wrap p{
  line-height:1.418rem;
  font-weight:300;
  display: flex
  ;
      align-items: center;
      gap: 1rem;
      flex-wrap: wrap;
}

.cc-doc-wrap p svg{
  width: 45px;
  flex-shrink: 0;
  border-radius: 100px;
  padding: 0.382rem;
  background: linear-gradient(235deg, rgb(255 255 255 / 18%) 0%, rgb(255 255 255 / 8%) 50%, rgb(255 255 255 / 1%) 100%)

}

.cc-doc-wrap p svg path{
fill: none !important;
stroke: rgb(193 191 162) !important;
stroke-width: 2px !important;
stroke-dashoffset: none!important;
}

.cc-photo-details-wrap{
	max-width: 600px
}

.cc-photo-details-wrap h1{
  margin-top:0;
  font-family: "scotch-text", sans-serif;
  font-weight: 400;
  margin-bottom: 1rem
}

.cc-photo-details-wrap h3{
  display:flex;
  grid-gap:0.5rem;
  font-family: "scotch-text", sans-serif;
  font-weight: 400;
  letter-spacing:0.3px
}

.cc-photo-details h3{
  display:flex;
  grid-gap:0.5rem;
  align-items:center;
  position:relative;
  font-family: "scotch-text-condensed", sans-serif;
	font-weight: 500;
	color: var(--maincolordarker);
}

.cc-photo-details h3:after {
	content: '';
	width: 100%;
	height: 1.5px;
	background: var(--offcolor);
}

.cc-photo-details-ingredient-wrap{
  display: flex;
	flex-direction: column;
	grid-gap: 1rem;
	margin: 1rem 0;
  padding: 0 1rem;
}

.cc-photo-details-ingredient-wrap > p:first-child{
  font-weight: 500;
	font-size: 0.9rem;
	position: relative;
	font-style: normal;
}

.cc-photo-details-ingredient-wrap > p:first-child:after{
  content: '';
	background: var(--strongcolor);
	width: 8px;
	height: 8px;
	border-radius: 100px;
	position: absolute;
	top: 50%;
	left: -1rem;
	transform: translateY(-50%);
}

.cc-photo-details-ingredient-wrap > p{
  font-size: 0.7rem;
	line-height: 1.5;
	margin: 0;
}


@media screen and (max-width: 750px) {
  html{
	font-size:15px;
  }

  .cc-window-sec{
	grid-template-columns:unset;
	grid-template-rows:0.618fr 1fr
  }
  .cc-gallery-wrap{
  grid-template-columns: repeat(auto-fit, minmax(150px,1fr));
	padding:1rem;
  }

  .cc-wimage-wrap img{
  object-fit:cover
}

  .cc-doc-wrap{
	padding:1.25rem 2rem
  }

}