/******************************************************************
  Template Name: DJoz
  Description:  DJoz Music HTML Template
  Author: Colorlib
  Author URI: https://colorlib.com
  Version: 1.0
  Created: Colorlib
******************************************************************/

/*------------------------------------------------------------------
[Table of contents]

1.  Template default CSS
	1.1	Variables
	1.2	Mixins
	1.3	Flexbox
	1.4	Reset
2.  Helper Css
3.  Header Section
4.  Hero Section
5.  Services Section
6.  Track Section
7.  Countdown Section
8.  Team Section
9.  Contact
10.  Footer Style
-------------------------------------------------------------------*/

/*----------------------------------------*/

/* Template default CSS
/*----------------------------------------*/

html,
body {
	height: 100%;
	font-family: "Now Regular";
	-webkit-font-smoothing: antialiased;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0;
	color: #111111;
	font-weight: 400;
	font-family: "Rajdhani", sans-serif;
}

h1 {
	font-size: 70px;
}

h2 {
	font-size: 36px;
}

h3 {
	font-size: 30px;
}

h4 {
	font-size: 24px;
}

h5 {
	font-size: 18px;
}

h6 {
	font-size: 16px;
}

p {
	font-size: 15px;
	font-family: "Now Regular";
	color: #444444;
	font-weight: 400;
	line-height: 26px;
	margin: 0 0 15px 0;
}

img {
	max-width: 100%;
}

input:focus,
select:focus,
button:focus,
textarea:focus {
	outline: none;
}

a:hover,
a:focus {
	text-decoration: none;
	outline: none;
	color: #ffffff;
}

ul,
ol {
	padding: 0;
	margin: 0;
}

/*---------------------
  Helper CSS
-----------------------*/

.section-title {
	margin-bottom: 40px;
	position: relative;
	z-index: 1;
}

.section-title.center-title {
	text-align: center;
}

.section-title h2 {
	font-size: 42px;
	color: #111111;
	font-weight: 700;
	text-transform: uppercase;
}

.section-title h1 {
	font-size: 100px;
	color: #f2f2f2;
	font-family: "Rockville Solid Regular";
	position: absolute;
	left: 0;
	top: -45px;
	width: 100%;
	z-index: -1;
}

.set-bg {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
}

.spad {
	padding-top: 100px;
	padding-bottom: 100px;
}

.text-white h1,
.text-white h2,
.text-white h3,
.text-white h4,
.text-white h5,
.text-white h6,
.text-white p,
.text-white span,
.text-white li,
.text-white a {
	color: #fff;
}

/* buttons */

.primary-btn {
	display: inline-block;
	font-size: 15px;
	text-transform: uppercase;
	padding: 14px 25px 12px;
	color: #ffffff;
	background: #5c00ce;
	letter-spacing: 2px;
}

.primary-btn.border-btn {
	background: transparent;
	border: 2px solid #5c00ce;
	color: #111111;
}

.site-btn {
  background: linear-gradient(to right, #5c00ce, #7e00ad);
  color: #fff;
  font-weight: bold;
  padding: 14px 25px;
  border: none;
  border-radius: 5px;
  transition: background 0.3s ease;
}
/* Preloder */

#preloder {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 999999;
	background: #000;
}

.loader {
	width: 40px;
	height: 40px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -13px;
	margin-left: -13px;
	border-radius: 60px;
	animation: loader 0.8s linear infinite;
	-webkit-animation: loader 0.8s linear infinite;
}

@keyframes loader {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
		border: 4px solid #f44336;
		border-left-color: transparent;
	}
	50% {
		-webkit-transform: rotate(180deg);
		transform: rotate(180deg);
		border: 4px solid #673ab7;
		border-left-color: transparent;
	}
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
		border: 4px solid #f44336;
		border-left-color: transparent;
	}
}

@-webkit-keyframes loader {
	0% {
		-webkit-transform: rotate(0deg);
		border: 4px solid #f44336;
		border-left-color: transparent;
	}
	50% {
		-webkit-transform: rotate(180deg);
		border: 4px solid #673ab7;
		border-left-color: transparent;
	}
	100% {
		-webkit-transform: rotate(360deg);
		border: 4px solid #f44336;
		border-left-color: transparent;
	}
}

/*---------------------
  Header
-----------------------*/

.header {
	background: rgba(42, 1, 74, 0.5);
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	z-index: 9;
}

.header.header--normal {
	position: relative;
	background: #290849;
}

.header__logo {
	padding: 20px 0 25px;
}

.header__logo a {
	display: inline-block;
}

.header__nav {
	text-align: right;
}

.header__menu {
  padding: 31px 0;
  margin: 0 auto;
}

.header__menu ul {
  display: flex;
  justify-content: center;
  gap: 40px;
  list-style: none;
  padding: 0;
  margin: 0;
}



.header__menu ul li.active a:after {
	opacity: 1;
}

.header__menu ul li:hover a:after {
	opacity: 1;
}

.header__menu ul li:hover .dropdown {
	top: 34px;
	opacity: 1;
	visibility: visible;
}

.header__menu ul li:last-child {
	margin-right: 0;
}

.header__menu ul li .dropdown {
	position: absolute;
	left: 0;
	top: 56px;
	width: 150px;
	background: #111111;
	text-align: left;
	padding: 2px 0;
	z-index: 9;
	opacity: 0;
	visibility: hidden;
	-webkit-transition: all, 0.3s;
	-o-transition: all, 0.3s;
	transition: all, 0.3s;
}

.header__menu ul li .dropdown li {
	display: block;
	margin-right: 0;
}

.header__menu ul li .dropdown li a {
	font-size: 14px;
	color: #ffffff;
	font-weight: 400;
	padding: 8px 20px;
	text-transform: capitalize;
}

.header__menu ul li .dropdown li a:after {
	display: none;
}

.header__menu ul li a {
	font-size: 15px;
	text-transform: uppercase;
	color: #ffffff;
	display: block;
	padding: 6px 0;
	position: relative;
}

.header__menu ul li a:after {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 2px;
	background: #ffffff;
	content: "";
	-webkit-transition: all, 0.5s;
	-o-transition: all, 0.5s;
	transition: all, 0.5s;
	opacity: 0;
}

.header__right__social {
	display: inline-block;
}

.header__right__social a {
	display: inline-block;
	font-size: 16px;
	color: #ffffff;
	margin-right: 16px;
}

.header__right__social a:last-child {
	margin-right: 0;
}

.slicknav_menu {
	display: none;
}

/*---------------------
  Hero
-----------------------*/

.hero {
	padding-top: 400px;
	padding-bottom: 295px;
	position: relative;
}

.hero__text {
	text-align: center;
}

.hero__text span {
	color: #ffffff;
	text-transform: uppercase;
	letter-spacing: 6px;
}

.hero__text h1 {
	font-size: 110px;
	font-family: "Rockville Solid Regular";
	color: #ffffff;
	margin-bottom: 20px;
	margin-top: 22px;
}

.hero__text p {
	color: #ffffff;
	margin-bottom: 20px;
}

.hero__text .play-btn {
	font-size: 26px;
	color: #5c00ce;
	height: 90px;
	width: 90px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.3);
	display: inline-block;
	line-height: 90px;
	text-align: center;
	position: relative;
	z-index: 1;
}

.hero__text .play-btn i {
	position: relative;
	top: 2px;
	left: 2px;
}

.hero__text .play-btn:after {
	position: absolute;
	left: 15px;
	top: 15px;
	height: 60px;
	width: 60px;
	background: #ffffff;
	border-radius: 50%;
	content: "";
	z-index: -1;
}

.linear__icon {
	position: absolute;
	left: 50%;
	bottom: 0;
	margin-left: -16px;
	-webkit-animation: mymove 0.5s infinite alternate;
	animation: mymove 0.5s infinite alternate;
}

.linear__icon i {
	font-size: 50px;
	color: #5c00ce;
}

@-webkit-keyframes mymove {
	0% {
		bottom: 0;
	}
	100% {
		bottom: -10px;
	}
}

@keyframes mymove {
	0% {
		bottom: 0;
	}
	100% {
		bottom: -10px;
	}
}

/*---------------------
  Events
-----------------------*/

.event {
	padding-bottom: 60px;
}

.event .section-title {
	margin-bottom: 10px;
	position: relative;
}

.event .section-title:after {
	position: absolute;
	right: 46px;
	top: 25px;
	height: 2px;
	width: 775px;
	background: rgba(225, 225, 225, 0.3);
	content: "";
	z-index: -1;
}

.event__slider .col-lg-4 {
	max-width: 100%;
}

.event__slider.owl-carousel .owl-stage-outer {
	padding-top: 30px;
	padding-bottom: 40px;
}

.event__slider.owl-carousel .owl-nav {
	position: absolute;
	right: 15px;
	top: -50px;
}

.event__slider.owl-carousel .owl-nav button {
	font-size: 22px;
	color: #111111;
	opacity: 0.5;
	margin-right: 10px;
}

.event__slider.owl-carousel .owl-nav button:last-child {
	margin-right: 0;
}

.event__item {
	-webkit-box-shadow: 0px 3px 15px rgba(22, 41, 124, 0.1);
	box-shadow: 0px 3px 15px rgba(22, 41, 124, 0.1);
}

.event__item__pic {
	height: 360px;
	position: relative;
}

.event__item__pic .tag-date {
	position: absolute;
	left: 0;
	bottom: -21px;
	width: 100%;
	text-align: center;
}

.event__item__pic .tag-date span {
	font-size: 15px;
	color: #ffffff;
	display: inline-block;
	background: #5c00ce;
	padding: 12px 8px 9px 20px;
}

.event__item__text {
	text-align: center;
	padding: 45px 10px 25px;
}

.event__item__text h4 {
	font-size: 26px;
	font-weight: 700;
	color: #111111;
	margin-bottom: 10px;
}

.event__item__text p {
	color: #888888;
	margin-bottom: 0;
}

.event__item__text p i {
	color: #5c00ce;
	margin-right: 8px;
	font-size: 17px;
}

/*---------------------
  Track
-----------------------*/

.track {
	padding-top: 120px;
	padding-bottom: 40px;
	overflow: hidden;
}

.track .section-title {
	margin-bottom: 105px;
}

.track__content {
	height: 502px;
	overflow-y: auto;
}

.track__all {
	text-align: right;
	margin-bottom: 100px;
}

.jp-play {
	position: relative;
	height: 50px;
	width: 50px;
	background: transparent;
	border: 2px solid #e1e1e1;
	border-radius: 50%;
}

.jp-play:after {
	position: absolute;
	display: block;
	left: 17px;
	top: 12px;
	width: 16px;
	height: 20px;
	background: url(../img/play-default.png);
	content: "";
}

.jp-state-playing .jp-play {
	background: #5c00ce !important;
	border-color: #5c00ce !important;
}

.jp-state-playing .jp-play:after {
	background: url(../img/pause.png) !important;
	left: 15px;
	top: 12px;
}

.jp-audio .jp-play:focus {
	background: #5c00ce !important;
	border-color: #5c00ce !important;
}

.jp-audio .jp-play:focus:after {
	background: url(../img/play.png);
}

.jp-seek-bar>div {
	height: 5px;
	background: #e1e1e1;
	cursor: pointer;
	width: 245px;
}

.player_bars {
	width: 350px;
	display: table;
	padding-left: 50px;
	position: relative;
	padding-top: 25px;
	float: left;
	margin-right: 30px;
}

.jp-play-bar {
	position: relative;
	height: 100%;
	background: #5c00ce;
	overflow: visible !important;
}

.jp-current-time {
	font-size: 15px;
	color: #111111;
	position: absolute;
	left: -50px;
	top: -9px;
}

.jp-duration {
	font-size: 15px;
	color: #111111;
	position: absolute;
	right: 0;
	top: 16px;
}

.player_controls_box {
	width: 50px;
	float: left;
	margin-right: 20px;
}

.jp-mute {
	font-size: 18px;
	border: none;
	background: none;
	color: #111111;
	position: absolute;
	left: 0;
	top: 13px;
}

.jp-volume-bar {
	height: 5px;
	width: 70px;
	background: #e1e1e1;
	cursor: pointer;
}

.jp-volume-bar-value {
	background: #5c00ce;
	height: 100%;
}

.jp-volume-controls {
	position: relative;
	width: 95px;
	float: left;
	padding-left: 30px;
	padding-top: 25px;
}

.single_player_container {
	overflow: hidden;
	margin-bottom: 40px;
}

.single_player_container:last-child {
	margin-bottom: 0;
}

.single_player_container h4 {
	font-size: 26px;
	color: #111111;
	font-weight: 700;
	margin-bottom: 20px;
	text-transform: uppercase;
}

.track__pic {
	position: relative;
	z-index: 1;
}

.track__pic:after {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: #f5f5f5;
	content: "";
	z-index: -1;
}

.track__pic img {
	position: relative;
	top: -50px;
	width: calc(100% - 40px);
	margin-left: 40px;
	height: 502px;
}

/*---------------------
  Youtube
-----------------------*/

.youtube {
	padding-bottom: 50px;
}

.youtube .section-title {
	text-align: center;
}

.youtube .section-title h1 {
	font-size: 90px;
}

.youtube__item {
	-webkit-transition: all, 0.3s;
	-o-transition: all, 0.3s;
	transition: all, 0.3s;
	margin-bottom: 30px;
}

.youtube__item:hover {
	-webkit-box-shadow: 0px 3px 30px rgba(22, 41, 124, 0.1);
	box-shadow: 0px 3px 30px rgba(22, 41, 124, 0.1);
}

.youtube__item__pic {
	height: 240px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.youtube__item__pic .play-btn {
	font-size: 16px;
	color: #5c00ce;
	height: 60px;
	width: 60px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.3);
	display: inline-block;
	line-height: 60px;
	text-align: center;
	position: relative;
	z-index: 1;
}

.youtube__item__pic .play-btn i {
	position: relative;
	top: 2px;
	left: 2px;
}

.youtube__item__pic .play-btn:after {
	position: absolute;
	left: 10px;
	top: 10px;
	height: 40px;
	width: 40px;
	background: #ffffff;
	border-radius: 50%;
	content: "";
	z-index: -1;
}

.youtube__item__text {
	padding: 25px 30px 20px 20px;
	background: #ffffff;
}

.youtube__item__text h4 {
	font-size: 26px;
	color: #111111;
	line-height: 34px;
	font-weight: 700;
}

/*---------------------
  Countdown
-----------------------*/

.countdown {
	padding-bottom: 560px;
}

.countdown.countdown--page {
	padding-top: 150px;
	padding-bottom: 150px;
}

.countdown__text {
	text-align: center;
	margin-bottom: 36px;
}

.countdown__text h1 {
	font-size: 90px;
	color: #ffffff;
	font-family: "Rockville Solid Regular";
	color: #ffffff;
	margin-bottom: 25px;
}

.countdown__text h4 {
	font-size: 26px;
	font-family: "Now Regular";
	color: #ffffff;
	text-transform: uppercase;
	letter-spacing: 4px;
}

.countdown__timer {
	text-align: center;
	margin-bottom: 30px;
}

.countdown__item {
	display: inline-block;
	margin-right: 80px;
	margin-bottom: 30px;
}

.countdown__item:last-child {
	margin-right: 0;
}

.countdown__item span {
	font-size: 90px;
	font-family: "Rajdhani", sans-serif;
	font-weight: 700;
	color: #ffffff;
	display: block;
	line-height: 100px;
}

.countdown__item p {
	color: #ffffff;
	letter-spacing: 4px;
	text-transform: uppercase;
	margin-bottom: 0;
}

.buy__tickets {
	text-align: center;
}

/*---------------------
  Discography
-----------------------*/

.discography {
	padding-bottom: 40px;
	padding-top: 120px;
	overflow: hidden;
}

.discography .section-title {
	margin-bottom: 90px;
}

.discography__item {
	margin-bottom: 45px;
	-webkit-box-shadow: 0px 5px 10px rgba(22, 41, 124, 0.1);
	box-shadow: 0px 5px 10px rgba(22, 41, 124, 0.1);
}

.discography__item__pic img {
	min-width: 100%;
}

.discography__item__text {
	padding: 25px 30px 35px;
	text-align: center;
}

.discography__item__text span {
	font-size: 18px;
	color: #5c00ce;
	font-weight: 700;
}

.discography__item__text h4 {
	font-size: 22px;
	text-transform: uppercase;
	color: #111111;
	margin-top: 10px;
	margin-bottom: 25px;
}

.discography__item__text a {
	display: inline-block;
	margin-right: 10px;
}

.discography__item__text a:last-child {
	margin-right: 0;
}

.pagination__links {
	text-align: center;
	padding-top: 10px;
}

.pagination__links.blog__pagination {
	text-align: left;
}

.pagination__links a {
	display: inline-block;
	font-size: 15px;
	color: #111111;
	text-transform: uppercase;
	letter-spacing: 2px;
	background: #f2f2f2;
	-webkit-transition: all, 0.3s;
	-o-transition: all, 0.3s;
	transition: all, 0.3s;
	margin-right: 6px;
	margin-bottom: 5px;
	padding: 14px 22px 12px;
}

.pagination__links a:last-child {
	margin-right: 0;
}

.pagination__links a:hover {
	background: #290849;
	color: #ffffff;
}

/*---------------------
  Footer
-----------------------*/

.footer {
	padding-top: 300px;
	padding-bottom: 60px;
	margin-top: -547px;
	height: 549px;
}

.footer.footer--normal {
	margin-top: 0;
}

.footer__address {
	margin-bottom: 50px;
}

.footer__address ul li {
	list-style: none;
	padding-left: 70px;
	position: relative;
	margin-bottom: 30px;
}

.footer__address ul li:last-child {
	margin-bottom: 0;
}

.footer__address ul li i {
	font-size: 18px;
	color: #5c00ce;
	height: 50px;
	width: 50px;
	background: #ffffff;
	border-radius: 50%;
	line-height: 50px;
	text-align: center;
	position: absolute;
	left: 0;
	top: 0;
}

.footer__address ul li p {
	color: #ffffff;
	opacity: 0.7;
	margin-bottom: 8px;
}

.footer__address ul li h6 {
	font-size: 15px;
	font-weight: 700;
	color: #ffffff;
}

.footer__social {
	text-align: center;
	position: relative;
	margin-bottom: 50px;
}

.footer__social::before {
	position: absolute;
	left: -46px;
	top: 3px;
	width: 1px;
	height: 130px;
	background: rgba(255, 255, 255, 0.2);
	content: "";
}

.footer__social::after {
	position: absolute;
	right: -50px;
	top: 3px;
	width: 1px;
	height: 130px;
	background: rgba(255, 255, 255, 0.2);
	content: "";
}

.footer__social h2 {
	color: #ffffff;
	font-weight: 700;
	margin-bottom: 25px;
}

.footer__social .footer__social__links a {
	font-size: 18px;
	color: #5c00ce;
	height: 50px;
	width: 50px;
	background: #ffffff;
	border-radius: 50%;
	line-height: 50px;
	text-align: center;
	display: inline-block;
	margin-right: 10px;
}

.footer__social .footer__social__links a:last-child {
	margin-right: 0;
}

.footer__newslatter {
	margin-bottom: 50px;
}

.footer__newslatter h4 {
	font-size: 26px;
	color: #ffffff;
	font-weight: 700;
	margin-bottom: 30px;
}

.footer__newslatter form {
	position: relative;
}

.footer__newslatter form input {
	height: 50px;
	font-size: 15px;
	color: #ffffff;
	width: 100%;
	background: transparent;
	border: 1px solid rgba(255, 255, 255, 0.2);
	padding-left: 20px;
}

.footer__newslatter form input::-webkit-input-placeholder {
	color: #ffffff;
}

.footer__newslatter form input::-moz-placeholder {
	color: #ffffff;
}

.footer__newslatter form input:-ms-input-placeholder {
	color: #ffffff;
}

.footer__newslatter form input::-ms-input-placeholder {
	color: #ffffff;
}

.footer__newslatter form input::placeholder {
	color: #ffffff;
}

.footer__newslatter form button {
	font-size: 18px;
	color: #5c00ce;
	position: absolute;
	right: 0;
	top: 0;
	height: 100%;
	padding: 0 16px;
	background: #ffffff;
	border: none;
}

.footer__copyright__text {
	text-align: center;
}

.footer__copyright__text p {
	color: #999999;
}

.footer__copyright__text a {
	color: #999999;
	text-decoration: underline;
}

.footer__copyright__text a:hover {
	color: #5c00ce;
}

.footer__copyright__text i {
	color: #c11;
}

/*---------------------
  Breadcrumb
-----------------------*/

.breadcrumb-option {
	padding-top: 35px;
}

.breadcrumb__links a {
	font-size: 15px;
	color: #111111;
	margin-right: 18px;
	display: inline-block;
	position: relative;
}

.breadcrumb__links a:after {
	position: absolute;
	right: -14px;
	top: 0;
	content: "|";
	color: #888888;
}

.breadcrumb__links a i {
	margin-right: 5px;
}

.breadcrumb__links span {
	font-size: 15px;
	color: #888888;
	display: inline-block;
}

/*---------------------
  About
-----------------------*/

.about {
	padding-top: 0;
}

.about.about--page {
	padding-top: 80px;
	padding-bottom: 80px;
}

.about.about--page .section-title {
	margin-bottom: 28px;
}

.about.about--page .section-title h2 {
	line-height: 55px;
}

.about.about--page .about__text {
	padding-top: 15px;
}

.about.about--page .about__text p {
	color: #111111;
}

.about__text {
	padding-top: 110px;
}

.about__text p {
	margin-bottom: 35px;
}

/*---------------------
  Skills
-----------------------*/

.skills {
	padding-bottom: 0;
	padding-top: 80px;
}

.skills__content {
	background: #5c00ce;
	height: 500px;
	padding: 100px 70px 60px;
}

.skills__content .section-title h2 {
	color: #ffffff;
}

.skills__content .section-title h1 {
	color: #ffffff;
	opacity: 0.1;
	text-align: center;
}

.skills__content p {
	color: #ffffff;
	margin-bottom: 32px;
}

.skill__bar__item {
	margin-bottom: 20px;
}

.skill__bar__item p {
	font-size: 15px;
	font-weight: 500;
	color: #ffffff;
	margin-bottom: 10px;
}

.skill__bar__item .barfiller {
	width: 100%;
	height: 5px;
	background: rgba(255, 255, 255, 0.2);
	border: none;
	margin-bottom: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
}

.skill__bar__item .barfiller .tip {
	margin-top: -32px;
	padding: 0;
	font-size: 15px;
	color: #fff;
	background: transparent;
}

.skill__bar__item .barfiller .tip:after {
	display: none;
}

.skills__video {
	height: 500px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.skills__video .play-btn {
	font-size: 26px;
	color: #5c00ce;
	height: 90px;
	width: 90px;
	border-radius: 50%;
	background: rgba(117, 31, 221, 0.3);
	display: inline-block;
	line-height: 90px;
	text-align: center;
	position: relative;
	z-index: 1;
}

.skills__video .play-btn i {
	position: relative;
	top: 2px;
	left: 2px;
}

.skills__video .play-btn:after {
	position: absolute;
	left: 15px;
	top: 15px;
	height: 60px;
	width: 60px;
	background: #ffffff;
	border-radius: 50%;
	content: "";
	z-index: -1;
}

/*---------------------
  About Pic
-----------------------*/

.about-pic {
	overflow: hidden;
}

.about-pic .container-fluid {
	padding-right: 0;
}

.about-pic img {
	min-width: 100%;
	margin-bottom: 10px;
	padding-right: 10px;
}

/*---------------------
  About Services
-----------------------*/

.about-services {
	padding-bottom: 50px;
}

.about-services .section-title {
	margin-bottom: 60px;
}

.about__services__item {
	-webkit-transition: all, 0.3s;
	-o-transition: all, 0.3s;
	transition: all, 0.3s;
}

.about__services__item:hover {
	-webkit-box-shadow: 0px 3px 30px rgba(22, 41, 124, 0.1);
	box-shadow: 0px 3px 30px rgba(22, 41, 124, 0.1);
}

.about__services__item__pic {
	height: 240px;
	position: relative;
}

.about__services__item__pic .icon {
	height: 50px;
	width: 50px;
	background: #5c00ce;
	border-radius: 50%;
	line-height: 50px;
	text-align: center;
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto;
	bottom: -25px;
}

.about__services__item__text {
	text-align: center;
	padding: 50px 10px 30px;
}

.about__services__item__text h4 {
	font-size: 26px;
	color: #111111;
	font-weight: 700;
	margin-bottom: 12px;
}

.about__services__item__text p {
	margin-bottom: 0;
}

/*---------------------
  Feature
-----------------------*/

.feature {
	padding-bottom: 70px;
}

.feature.feature--about .section-title span {
	color: #0071e4;
}

.feature.feature--about .feature__item {
	background: #f5f5f5;
}

.feature.feature--about .feature__item h5 {
	color: #111111;
}

.feature__text {
	padding-top: 80px;
}

.feature__text .section-title {
	margin-bottom: 20px;
}

.feature__text p {
	margin-bottom: 26px;
}

.feature__item {
	background: #0c2b4b;
	text-align: center;
	padding: 40px 10px 35px;
	margin-bottom: 30px;
}

.feature__item.right-column {
	margin-top: 120px;
}

.feature__item h5 {
	font-weight: 700;
	text-transform: uppercase;
	color: #ffffff;
	margin-top: 25px;
}

/*---------------------
  Services
-----------------------*/

.services {
	overflow: hidden;
}

.services__left {
	height: 640px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.services__left .play-btn {
	font-size: 26px;
	color: #ffffff;
	height: 90px;
	width: 90px;
	border-radius: 50%;
	background: -webkit-gradient(linear, left top, right top, from(rgba(127, 0, 173, 0.3)), to(rgba(93, 0, 206, 0.3)));
	background: -o-linear-gradient(left, rgba(127, 0, 173, 0.3), rgba(93, 0, 206, 0.3));
	background: linear-gradient(to right, rgba(127, 0, 173, 0.3), rgba(93, 0, 206, 0.3));
	display: inline-block;
	line-height: 90px;
	text-align: center;
	position: relative;
	z-index: 1;
}

.services__left .play-btn i {
	position: relative;
	top: 2px;
	left: 2px;
}

.services__left .play-btn:after {
	position: absolute;
	left: 15px;
	top: 15px;
	height: 60px;
	width: 60px;
	background: -webkit-gradient(linear, left top, right top, from(#7E00AD), to(#5C00CE));
	background: -o-linear-gradient(left, #7E00AD, #5C00CE);
	background: linear-gradient(to right, #7E00AD, #5C00CE);
	border-radius: 50%;
	content: "";
	z-index: -1;
}

.services__list {
	margin: 0;
}

.service__item {
	background: #5c00ce;
	height: 320px;
	padding: 70px 40px 40px 70px;
}

.service__item.deep-bg {
	background: #5400BC;
}

.service__item h4 {
	font-size: 26px;
	color: #ffffff;
	font-weight: 700;
	margin-top: 25px;
	margin-bottom: 10px;
}

.service__item p {
	color: #ffffff;
	margin-bottom: 0;
}

/*---------------------
  Tours
-----------------------*/

.tours {
	padding-top: 150px;
	padding-bottom: 60px;
}

.tours__item__text {
	padding-right: 30px;
	margin-bottom: 100px;
}

.tours__item__text.tours__item__text--right {
	padding-left: 30px;
	padding-right: 0;
}

.tours__item__text h2 {
	font-size: 42px;
	color: #111111;
	text-transform: uppercase;
	margin-bottom: 24px;
}

.tours__item__text .tours__text__widget {
	overflow: hidden;
	border-bottom: 2px solid #f2f2f2;
	padding-bottom: 38px;
}

.tours__item__text .tours__text__widget ul {
	float: left;
}

.tours__item__text .tours__text__widget ul li {
	list-style: none;
	font-size: 15px;
	color: #111111;
	padding-left: 35px;
	position: relative;
	margin-bottom: 10px;
}

.tours__item__text .tours__text__widget ul li:last-child {
	margin-bottom: 0;
}

.tours__item__text .tours__text__widget ul li i {
	color: #5c00ce;
	position: absolute;
	left: 0;
	top: 3px;
}

.tours__item__text .tours__text__widget ul li span {
	display: inline-block;
	padding-right: 8px;
	position: relative;
	margin-right: 5px;
}

.tours__item__text .tours__text__widget ul li span:last-child {
	padding-right: 0;
	margin-right: 0;
}

.tours__item__text .tours__text__widget ul li span:last-child:after {
	display: none;
}

.tours__item__text .tours__text__widget ul li span:after {
	position: absolute;
	right: 0;
	top: 0;
	content: "|";
}

.tours__item__text .tours__text__widget .price {
	font-size: 18px;
	color: #ffffff;
	font-weight: 700;
	display: inline-block;
	padding: 14px 25px 12px 30px;
	background: #5c00ce;
	float: right;
}

.tours__item__text .tours__text__desc {
	padding-top: 40px;
	margin-bottom: 65px;
}

.tours__item__text .tours__text__desc p {
	color: #111111;
	margin-bottom: 20px;
}

.tours__item__text .tours__text__desc p:last-child {
	margin-bottom: 0;
}

.tours__item__pic {
	position: relative;
	z-index: 1;
	padding-right: 50px;
	margin-bottom: 110px;
	padding-left: 30px;
}

.tours__item__pic.tours__item__pic--left {
	padding-left: 50px;
	padding-right: 0;
}

.tours__item__pic.tours__item__pic--left:after {
	left: 0;
}

.tours__item__pic.tours__item__pic--last {
	margin-bottom: 0;
}

.tours__item__pic:after {
	position: absolute;
	left: 50px;
	top: -50px;
	width: calc(100% - 50px);
	height: 100%;
	border: 20px solid rgba(9, 53, 247, 0.1);
	content: "";
	z-index: -1;
}

.tours__item__pic img {
	min-width: 100%;
}

/*---------------------
  Videos
-----------------------*/

.videos {
	padding-bottom: 90px;
}

.videos .section-title {
	margin-bottom: 70px;
}

.videos__large__item {
	height: 585px;
	position: relative;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	margin-bottom: 30px;
}

.videos__large__item .play-btn {
	height: 50px;
	width: 50px;
	background: #5c00ce;
	border-radius: 50%;
	font-size: 18px;
	line-height: 50px;
	text-align: center;
	display: inline-block;
	color: #ffffff;
}

.videos__large__item__text {
	background: rgba(7, 14, 38, 0.7);
	padding: 25px 30px 25px;
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
}

.videos__large__item__text h4 {
	color: #ffffff;
	font-weight: 700;
}

.videos__large__item__text ul li {
	font-size: 13px;
	list-style: none;
	display: inline-block;
	margin-right: 18px;
	color: #ffffff;
	position: relative;
}

.videos__large__item__text ul li:after {
	position: absolute;
	right: -12px;
	top: 2px;
	height: 17px;
	width: 1px;
	background: #ffffff;
	content: "";
}

.videos__large__item__text ul li:last-child {
	margin-right: 0;
}

.videos__large__item__text ul li:last-child:after {
	display: none;
}

.videos__item__pic {
	height: 180px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.videos__item__pic .play-btn {
	height: 40px;
	width: 40px;
	background: #5c00ce;
	border-radius: 50%;
	font-size: 16px;
	line-height: 40px;
	text-align: center;
	display: inline-block;
	color: #ffffff;
}

.videos__item__text {
	padding-top: 20px;
}

.videos__item__text h5 {
	color: #111111;
	font-weight: 700;
	line-height: 26px;
	margin-bottom: 5px;
}

.videos__item__text ul li {
	font-size: 13px;
	list-style: none;
	display: inline-block;
	margin-right: 18px;
	color: #5c00ce;
	position: relative;
}

.videos__item__text ul li:after {
	position: absolute;
	right: -12px;
	top: 2px;
	height: 17px;
	width: 1px;
	background: #888888;
	content: "";
}

.videos__item__text ul li:last-child {
	margin-right: 0;
	color: #888888;
}

.videos__item__text ul li:last-child:after {
	display: none;
}

.videos__slider .col-lg-3 {
	max-width: 100%;
}

.videos__slider.owl-carousel .owl-nav button {
	font-size: 18px;
	color: #888888;
	height: 50px;
	width: 25px;
	background: #ffffff;
	line-height: 50px;
	position: absolute;
	left: 15px;
	top: 22%;
}

.videos__slider.owl-carousel .owl-nav button.owl-next {
	left: auto;
	right: 15px;
}

/*---------------------
    Blog
-----------------------*/

.blog {
	padding-bottom: 60px;
}

.blog .section-title {
	margin-bottom: 80px;
}

.blog__large {
	margin-bottom: 45px;
	-webkit-box-shadow: 0px 3px 10px rgba(22, 41, 124, 0.1);
	box-shadow: 0px 3px 10px rgba(22, 41, 124, 0.1);
	margin-bottom: 50px;
}

.blog__large__pic {
	height: 370px;
	position: relative;
}

.blog__large__pic a {
	font-size: 16px;
	height: 40px;
	width: 40px;
	background: rgba(245, 245, 245, 0.3);
	border-radius: 50%;
	color: #ffffff;
	line-height: 40px;
	text-align: center;
	display: inline-block;
	position: absolute;
	right: 12px;
	bottom: 12px;
}

.blog__large__text {
	background: #ffffff;
	text-align: center;
	padding: 30px 40px 0;
}

.blog__large__text span {
	font-size: 13px;
	text-transform: uppercase;
	color: #5c00ce;
}

.blog__large__text h4 {
	color: #111111;
	font-weight: 700;
	line-height: 31px;
	margin-top: 5px;
	margin-bottom: 15px;
}

.blog__large__text p {
	margin-bottom: 40px;
}

.blog__large__widget {
	border-top: 1px solid #f2f2f2;
	padding: 15px 0 20px;
	text-align: left;
	margin: 0 30px;
}

.blog__large__widget .right__widget {
	text-align: right;
}

.blog__large__widget ul li {
	font-size: 13px;
	color: #888888;
	display: inline-block;
	list-style: none;
	margin-right: 20px;
	position: relative;
}

.blog__large__widget ul li span {
	color: #111111;
}

.blog__large__widget ul li:after {
	position: absolute;
	right: -14px;
	top: -2px;
	content: "|";
}

.blog__large__widget ul li:last-child {
	margin-right: 0;
}

.blog__large__widget ul li:last-child:after {
	display: none;
}

.blog__item {
	-webkit-box-shadow: 0px 3px 10px rgba(22, 41, 124, 0.1);
	box-shadow: 0px 3px 10px rgba(22, 41, 124, 0.1);
	margin-bottom: 50px;
}

.blog__item__pic img {
	min-width: 100%;
}

.blog__item__text {
	text-align: center;
	background: #ffffff;
	padding: 20px 20px 25px;
}

.blog__item__text span {
	font-size: 13px;
	text-transform: uppercase;
	color: #5c00ce;
}

.blog__item__text h5 {
	color: #111111;
	font-weight: 700;
	line-height: 26px;
	font-size: 20px;
	margin-top: 10px;
	margin-bottom: 12px;
}

.blog__item__text ul li {
	font-size: 13px;
	color: #888888;
	display: inline-block;
	list-style: none;
	margin-right: 20px;
	position: relative;
}

.blog__item__text ul li span {
	color: #111111;
}

.blog__item__text ul li:after {
	position: absolute;
	right: -14px;
	top: -2px;
	content: "|";
}

.blog__item__text ul li:last-child {
	margin-right: 0;
}

.blog__item__text ul li:last-child:after {
	display: none;
}

/*---------------------
  Blog Sidebar
-----------------------*/

.blog__sidebar__item {
	text-align: center;
	margin-bottom: 65px;
}

.blog__sidebar__item:last-child {
	margin-bottom: 0;
}

.blog__sidebar__item form input {
	height: 50px;
	font-size: 15px;
	color: #444444;
	padding-left: 20px;
	border: 1px solid #e1e1e1;
	width: 100%;
	margin-bottom: 20px;
}

.blog__sidebar__item form input::-webkit-input-placeholder {
	color: #444444;
}

.blog__sidebar__item form input::-moz-placeholder {
	color: #444444;
}

.blog__sidebar__item form input:-ms-input-placeholder {
	color: #444444;
}

.blog__sidebar__item form input::-ms-input-placeholder {
	color: #444444;
}

.blog__sidebar__item form input::placeholder {
	color: #444444;
}

.blog__sidebar__title {
	text-align: center;
	margin-bottom: 35px;
}

.blog__sidebar__title h4 {
	color: #111111;
	font-weight: 700;
	position: relative;
	padding-bottom: 20px;
}

.blog__sidebar__title h4::before {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 5px;
	width: 70px;
	background: #e1e1e1;
	content: "";
	margin: 0 auto;
}

.blog__sidebar__social a {
	display: inline-block;
	font-size: 18px;
	color: #111111;
	width: 50px;
	height: 50px;
	background: #f2f2f2;
	border-radius: 50%;
	line-height: 50px;
	text-align: center;
	margin-right: 6px;
	margin-bottom: 5px;
}

.blog__sidebar__social a:last-child {
	margin-right: 6px;
}

.recent__item {
	display: block;
	overflow: hidden;
	margin-bottom: 25px;
	text-align: left;
}

.recent__item__pic {
	float: left;
	margin-right: 25px;
}

.recent__item__text {
	overflow: hidden;
}

.recent__item__text h6 {
	color: #111111;
	line-height: 21px;
	font-weight: 700;
}

.recent__item__text span {
	font-size: 13px;
	color: #888888;
}

/*---------------------
  Blog Details
-----------------------*/

.blog-details {
	padding-bottom: 60px;
	padding-top: 70px;
}

.blog__details__item {
	margin-bottom: 32px;
}

.blog__details__item__pic {
	height: 385px;
	position: relative;
}

.blog__details__item__pic a {
	font-size: 16px;
	height: 40px;
	width: 40px;
	background: rgba(245, 245, 245, 0.3);
	border-radius: 50%;
	color: #ffffff;
	line-height: 40px;
	text-align: center;
	display: inline-block;
	position: absolute;
	right: 12px;
	bottom: 12px;
}

.blog__details__item__text {
	background: #ffffff;
	padding-top: 30px;
}

.blog__details__item__text span {
	font-size: 13px;
	text-transform: uppercase;
	color: #5c00ce;
}

.blog__details__item__text h3 {
	color: #111111;
	font-weight: 700;
	line-height: 31px;
	margin-top: 5px;
	margin-bottom: 15px;
}

.blog__details__item__text p {
	margin-bottom: 40px;
}

.blog__details__item__widget {
	border-top: 1px solid #f2f2f2;
	padding-top: 15px;
	text-align: left;
}

.blog__details__item__widget ul li {
	font-size: 13px;
	color: #888888;
	display: inline-block;
	list-style: none;
	margin-right: 20px;
	position: relative;
}

.blog__details__item__widget ul li span {
	color: #111111;
}

.blog__details__item__widget ul li:after {
	position: absolute;
	right: -14px;
	top: -2px;
	content: "|";
}

.blog__details__item__widget ul li:last-child {
	margin-right: 0;
}

.blog__details__item__widget ul li:last-child:after {
	display: none;
}

.blog__details__desc {
	margin-bottom: 54px;
}

.blog__details__desc p {
	margin-bottom: 20px;
}

.blog__details__desc p:last-child {
	margin-bottom: 0;
}

.blog__details__quote {
	border: 1px solid #e1e1e1;
	padding: 35px 40px 35px 40px;
	position: relative;
	margin-bottom: 35px;
}

.blog__details__quote p {
	font-size: 18px;
	color: #111111;
	line-height: 31px;
}

.blog__details__quote h6 {
	font-size: 15px;
	color: #888888;
	text-transform: uppercase;
}

.blog__details__quote i {
	font-size: 36px;
	color: #5c00ce;
	position: absolute;
	right: 40px;
	bottom: 35px;
}

.blog__details__tags {
	padding-top: 20px;
	margin-bottom: 60px;
}

.blog__details__tags a {
	display: inline-block;
	font-size: 15px;
	color: #444444;
	padding: 12px 20px 10px;
	background: #f5f5f5;
	margin-right: 10px;
}

.blog__details__tags a:last-child {
	margin-right: 0;
}

.blog__details__option {
	margin-bottom: 60px;
}

.blog__option__btn {
	display: block;
	overflow: hidden;
}

.blog__option__btn.blog__option__btn--next {
	text-align: right;
}

.blog__option__btn.blog__option__btn--next .option__btn__name i {
	margin-right: 0;
	margin-left: 6px;
}

.blog__option__btn.blog__option__btn--next .blog__option__btn__item {
	overflow: hidden;
}

.blog__option__btn.blog__option__btn--next .blog__option__btn__item .blog__option__btn__pic {
	float: right;
	margin-right: 0;
	margin-left: 30px;
}

.blog__option__btn .option__btn__name {
	font-size: 15px;
	color: #444444;
	font-weight: 700;
	text-transform: uppercase;
	margin-bottom: 25px;
}

.blog__option__btn .option__btn__name i {
	font-size: 18px;
	font-weight: 700;
	margin-right: 6px;
}

.blog__option__btn__pic {
	float: left;
	margin-right: 26px;
}

.blog__option__btn__text {
	overflow: hidden;
}

.blog__option__btn__text h6 {
	color: #111111;
	font-weight: 700;
	line-height: 21px;
}

.blog__option__btn__text span {
	color: #888888;
	font-size: 13px;
}

.blog__details__services {
	margin-bottom: 30px;
}

.blog__details__services__title,
.blog__details__form__title {
	text-align: center;
	margin-bottom: 30px;
}

.blog__details__services__title h4,
.blog__details__form__title h4 {
	color: #111111;
	font-weight: 700;
	position: relative;
	padding-bottom: 20px;
	font-size: 26px;
}

.blog__details__services__title h4::before,
.blog__details__form__title h4::before {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 5px;
	width: 70px;
	background: #e1e1e1;
	content: "";
	margin: 0 auto;
}

.blog__details__services__item {
	-webkit-box-shadow: 0px 5px 15px rgba(0, 61, 85, 0.07);
	box-shadow: 0px 5px 15px rgba(0, 61, 85, 0.07);
	margin-bottom: 30px;
}

.blog__details__services__item__pic img {
	min-width: 100%;
}

.blog__details__services__item__text {
	padding: 15px 20px 10px;
}

.blog__details__services__item__text h6 a {
	font-size: 17px;
	color: #111111;
	font-weight: 700;
	line-height: 22px;
}

.blog__details__services__item__text span {
	color: #888888;
	font-size: 13px;
}

.blog__details__form form .input__list,
.contact__form form .input__list {
	margin-right: -20px;
	overflow: hidden;
}

.blog__details__form form .input__list input,
.contact__form form .input__list input {
	height: 50px;
	font-size: 13px;
	color: #666666;
	padding-left: 20px;
	border: 1px solid #e1e1e1;
	width: calc(33.33% - 20px);
	margin-bottom: 20px;
	margin-right: 16px;
}

.blog__details__form form .input__list input::-webkit-input-placeholder,
.contact__form form .input__list input::-webkit-input-placeholder {
	color: #666666;
}

.blog__details__form form .input__list input::-moz-placeholder,
.contact__form form .input__list input::-moz-placeholder {
	color: #666666;
}

.blog__details__form form .input__list input:-ms-input-placeholder,
.contact__form form .input__list input:-ms-input-placeholder {
	color: #666666;
}

.blog__details__form form .input__list input::-ms-input-placeholder,
.contact__form form .input__list input::-ms-input-placeholder {
	color: #666666;
}

.blog__details__form form .input__list input::placeholder,
.contact__form form .input__list input::placeholder {
	color: #666666;
}

.blog__details__form form textarea,
.contact__form form textarea {
	height: 120px;
	font-size: 13px;
	color: #666666;
	padding-left: 20px;
	padding-top: 12px;
	border: 1px solid #e1e1e1;
	width: 100%;
	margin-bottom: 14px;
	resize: none;
}

.blog__details__form form textarea::-webkit-input-placeholder,
.contact__form form textarea::-webkit-input-placeholder {
	color: #666666;
}

.blog__details__form form textarea::-moz-placeholder,
.contact__form form textarea::-moz-placeholder {
	color: #666666;
}

.blog__details__form form textarea:-ms-input-placeholder,
.contact__form form textarea:-ms-input-placeholder {
	color: #666666;
}

.blog__details__form form textarea::-ms-input-placeholder,
.contact__form form textarea::-ms-input-placeholder {
	color: #666666;
}

.blog__details__form form textarea::placeholder,
.contact__form form textarea::placeholder {
	color: #666666;
}

/*---------------------
  Map
-----------------------*/

.map {
	height: 585px;
	margin-top: 60px;
}

.map iframe {
	width: 100%;
}

/*---------------------
  Contact
-----------------------*/

.contact {
	padding-top: 70px;
	padding-bottom: 50px;
}

.contact__address .section-title {
	margin-bottom: 10px;
}

.contact__address .section-title h2 {
	text-transform: none;
}

.contact__address p {
	margin-bottom: 34px;
}

.contact__address ul li {
  display: flex;
  align-items: flex-start;
  gap: 15px;
  margin-bottom: 25px;
}


.contact__address ul li:last-child {
	margin-bottom: 0;
}

.contact__address ul li i {
  font-size: 22px;
  color: #5c00ce;
  background: #f6f2fb;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
}

.contact__address h5 {
  margin-bottom: 5px;
  font-weight: 700;
}

.contact__address ul li p {
	margin-bottom: 0;
}

.contact__address ul li span {
	font-size: 15px;
	color: #111111;
	display: inline-block;
	margin-right: 25px;
	position: relative;
}

.contact__address ul li span:after {
	position: absolute;
	right: -20px;
	top: -1px;
	content: ".";
	font-size: 39px;
	line-height: 0;
	border-radius: 50%;
}

.contact__address ul li span:last-child {
	margin-right: 0;
}

.contact__address ul li span:last-child:after {
	display: none;
}

.contact__form .section-title {
	margin-bottom: 10px;
}

.contact__form .section-title h2 {
	text-transform: none;
}

.contact__form p {
	margin-bottom: 34px;
}

/*--------------------------------- Responsive Media Quaries -----------------------------*/

@media only screen and (min-width: 1200px) {
	.container {
		max-width: 1170px;
	}
}

/* Medium Device = 1200px */

@media only screen and (min-width: 992px) and (max-width: 1199px) {
	.header__menu ul li {
		margin-right: 18px;
	}
	.header__menu {
		margin-right: 30px;
	}
	.service__item {
		padding: 40px 30px 30px 40px;
	}
	.skills__content {
		padding: 60px 40px 40px;
	}
	.discography__item__text a {
		margin-right: 0;
		text-align: center;
		margin-bottom: 10px;
	}
}

/* Tablet Device = 768px */

@media only screen and (min-width: 768px) and (max-width: 991px) {
	.header__right__social {
		display: none;
	}
	.header__menu {
		margin-right: 0;
	}
	.header__menu ul li {
		margin-right: 15px;
	}
	.event .section-title:after {
		width: 560px;
	}
	.track__all {
		text-align: left;
		margin-bottom: 60px;
	}
	.track__content {
		margin-bottom: 120px;
	}
	.track__pic img {
		height: auto;
	}
	.footer {
		height: auto;
	}
	.about.about--page .about__text {
		padding-top: 30px;
	}
	.discography__item__text a {
		margin-right: 0;
		text-align: center;
		margin-bottom: 10px;
	}
	.blog__sidebar {
		padding-top: 50px;
	}
	.contact__address {
		margin-bottom: 40px;
	}
	.footer__social::before {
		display: none;
	}
	.footer__social::after {
		display: none;
	}
	.tours__item__pic {
		margin-bottom: 50px;
	}
	.tours__item__text {
		padding-right: 0;
	}
	.countdown {
		padding-bottom: 776px;
	}
	.footer {
		margin-top: -740px;
		background-position: top 0 left 19%;
	}
}

/* Wide Mobile = 480px */

@media only screen and (max-width: 767px) {
	.hero {
		padding-top: 190px;
		padding-bottom: 200px;
	}
	.event .section-title:after {
		display: none;
	}
	.track__all {
		text-align: left;
		margin-bottom: 60px;
	}
	.track__content {
		margin-bottom: 120px;
	}
	.track .p-0 {
		padding: 0 15px !important;
	}
	.track__pic img {
		height: auto;
	}
	.discography__item__text a {
		margin-right: 0;
		text-align: center;
		margin-bottom: 10px;
	}
	.blog__sidebar {
		padding-top: 50px;
	}
	.contact__address {
		margin-bottom: 40px;
	}
	.footer {
		height: auto;
	}
	.footer__social::before {
		display: none;
	}
	.footer__social::after {
		display: none;
	}
	.player_bars {
		width: 240px;
		margin-right: 20px;
	}
	.jp-seek-bar>div {
		width: 140px;
	}
	.countdown__item {
		margin-right: 0;
		margin-bottom: 30px;
		width: 50%;
		float: left;
	}
	.footer__social {
		text-align: left;
	}
	.skills__content {
		height: auto;
	}
	.about.about--page .about__text {
		padding-top: 30px;
	}
	.tours__item__pic {
		margin-bottom: 50px;
	}
	.blog__large__widget ul {
		text-align: center;
	}
	.blog__large__widget .right__widget {
		text-align: center;
	}
	.blog__option__btn {
		margin-bottom: 30px;
	}
	.blog__details__form form .input__list,
	.contact__form form .input__list {
		margin-right: 0;
		overflow: visible;
	}
	.blog__details__form form .input__list input,
	.contact__form form .input__list input {
		width: 100%;
		margin-right: 0;
	}
	.header__nav {
		display: none;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        text-align: center;
    }

	
	.header .container {
		position: relative;
	}
	.slicknav_btn {
		position: absolute;
		right: 15px;
		top: 25px;
		margin: 0;
		border-radius: 0;
		padding: 12px 15px;
		float: none;
		background: #5c00ce;
	}
	.slicknav_nav {
		position: absolute;
		left: 0;
		top: 90px;
		background: #222;
		width: 100%;
	}
	.slicknav_menu {
		background: transparent;
		padding: 0;
		display: block;
	}
	.slicknav_nav ul {
		margin: 0;
		padding: 5px 0;
	}
	.slicknav_nav .slicknav_row,
	.slicknav_nav a {
		padding: 10px 28px;
		margin: 0;
	}
	.slicknav_nav a:hover {
		border-radius: 0;
		background: #5c00ce;
		color: #ffffff;
	}
	.slicknav_nav .slicknav_row:hover {
		border-radius: 0;
		background: #5c00ce;
		color: #ffffff;
	}
	.service__item {
		height: auto;
	}
	.tours__item__text {
		padding-right: 0;
	}
	.countdown {
		padding-bottom: 940px;
	}
	.footer {
		margin-top: -940px;
		background-position: top 0 left 19%;
	}

}
/* Small Device = 320px */

@media only screen and (max-width: 479px) {
	.section-title h1 {
		top: -40px;
		font-size: 79px;
		line-height: 0.8;
	}
	.hero__text h1 {
		font-size: 70px;
	}
	.videos {
		padding-bottom: 0;
	}
	.countdown__text h1 {
		font-size: 50px;
	}
	.single_player_container h4 {
		font-size: 16px;
	}
	.player_bars {
		width: 150px;
		margin-right: 10px;
	}
	.player_controls_box {
		margin-right: 10px;
	}
	.jp-volume-controls {
		width: 68px;
		padding-left: 23px;
	}
	.jp-volume-bar {
		width: 42px;
	}
	.jp-seek-bar>div {
		width: 55px;
	}
	.service__item {
		height: auto;
		padding: 40px 40px 40px 40px;
	}
	.skills__content {
		height: auto;
		padding: 80px 25px 40px;
	}
	.tours__item__text .tours__text__widget ul {
		float: none;
		margin-bottom: 30px;
	}
	.tours__item__text .tours__text__widget .price {
		float: none;
	}
	.tours__item__pic {
		padding-left: 0;
	}
	.tours__item__text.tours__item__text--right {
		padding-left: 0;
	}
	.blog__large__text {
		padding: 30px 20px 0;
	}
	.blog__large__widget {
		margin: 0;
	}
	.blog__details__tags a {
		margin-bottom: 10px;
	}
	.countdown {
		padding-bottom: 980px;
	}
	.footer {
		margin-top: -970px;
		background-position: top 0 left 19%;
	}
}
.hero {
    height: 100vh; /* 100% del alto de la pantalla */
    background-size: cover; /* Que la imagen cubra todo */
    background-position: center center; /* Centrada */
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    margin: 0;
    position: relative;
	animation: expandHero 2s ease-out forwards;
    transform: scale(0.8);
    opacity: 0;

}
@keyframes expandHero {
    0% {
        transform: scale(0.8);
        opacity: 0;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

.hero.spad {
    padding-top: 0;
    padding-bottom: 0;
}
.header {
    background: rgba(67, 0, 93, 0.7); /* Fondo morado transparente */
    position: absolute; /* Quita el fondo fijo */
    width: 100%;
    z-index: 10;
}
.header__menu ul li.active a::after {
    height: 2px; /* Antes era como 4px o más */
    background: #b98acd; /* O el color que prefieras */
}
.about__pic img {
    width: 100%;
    max-width: 950px; /* <-- AUMENTA este valor para que la imagen crezca más */
    margin-left: -40px;
    display: block;
}

.about .row {
    display: flex;
    align-items: center;
}
.hero {
    padding-top: 80px; /* Ajusta este valor según la altura real del header */
}

.hero__text {
    margin-top: 0;
    padding-top: 0;
    text-align: center; /* Opcional si quieres centrar el texto */
}
.about__pic img {
    width: 100%;
    max-width: 550px; /* Más grande que antes */
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.about__pic img:hover {
    transform: scale(1.1); /* Más grande que antes */
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.4);
}

.about__pic {
    opacity: 0;
    transform: translateX(-50px);
    animation: fadeInLeft 1s ease-out forwards;
    animation-delay: 0.3s;
	text-align: center;
}

@keyframes fadeInLeft {
    to {
        opacity: 1;
        transform: translateX(0);
    }
}
.youtube {
    padding-bottom: 300px; /* Espacio extra antes del footer */
    position: relative;
    z-index: 2;
}
.enhanced-bio .highlight-text {
    font-size: 18px;
    line-height: 1.8;
    color: #290849;
    font-weight: 600;
    font-style: italic;
    background: #f9f1ff;
    border-left: 5px solid #5c00ce;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}

/* Galería ordenada */
.gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    max-width: 1000px;
    margin: 0 auto;
}

.gallery-grid img {
    width: 100%;
    border-radius: 15px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    transition: transform 0.3s ease;
}

.gallery-grid img:hover {
    transform: scale(1.05);
}

/* Animaciones suaves */
.fade-in-up {
    opacity: 0;
    transform: translateY(30px);
    animation: fadeInUp 1.2s ease-out forwards;
}

.fade-in-left {
    opacity: 0;
    transform: translateX(-30px);
    animation: fadeInLeft 1.2s ease-out forwards;
}

@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInLeft {
    to {
        opacity: 1;
        transform: translateX(0);
    }
}
.fade-in-up {
  opacity: 0;
  transform: translateY(30px);
  animation: fadeInUp 1s ease-out forwards;
}

@keyframes fadeInUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.discography__item img {
  width: 100%;
  border-radius: 12px;
  margin-bottom: 15px;
  box-shadow: 0 5px 15px rgba(0,0,0,0.15);
}

.discography__item h5 {
  font-size: 18px;
  color: #290849;
  font-weight: 700;
}

.discography__item .year {
  font-size: 14px;
  color: #888;
  font-weight: normal;
}
.collab-card {
  position: relative;
  overflow: hidden;
  border-radius: 15px;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15);
  transition: transform 0.3s ease;
  cursor: pointer;
}

.collab-image {
  width: 100%;
  padding-top: 100%; /* cuadrado */
  background-size: cover;
  background-position: center;
  transition: transform 0.4s ease;
}

.collab-info {
  background-color: #290849;
  color: white;
  padding: 15px;
  text-align: center;
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.4s ease;
}

.collab-card:hover .collab-image {
  transform: scale(1.1);
}

.collab-card:hover .collab-info {
  opacity: 1;
  transform: translateY(0);
}

.collab-info h5 {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 5px;
}

.collab-info p {
  font-size: 14px;
  margin: 0;
  opacity: 0.85;
}
.video-card {
  cursor: pointer;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 20px rgba(0,0,0,0.1);
  transition: transform 0.3s ease;
}
.video-card:hover {
  transform: scale(1.03);
}
.video-thumb {
  width: 100%;
  padding-top: 56.25%;
  background-size: cover;
  background-position: center;
  position: relative;
}
.play-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 36px;
  color: white;
  background: rgba(0,0,0,0.6);
  padding: 16px;
  border-radius: 50%;
}
.video-info {
  padding: 15px;
  background-color: #290849;
  color: white;
  text-align: center;
}
.video-info h5 {
  margin: 0;
  font-size: 18px;
  font-weight: bold;
}

.fullscreen-video-thumb {
  width: 100%;
  max-width: 100%;
  height: 85vh;
  margin-bottom: 40px;
  position: relative;
  overflow: hidden;
  border-radius: 15px;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.25);
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
}

.thumbnail-image {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  transition: transform 0.4s ease;
}
.fullscreen-video-thumb {
  aspect-ratio: 16 / 9;
  height: auto;
  max-width: 100%;
}


.fullscreen-video-thumb:hover .thumbnail-image {
  transform: scale(1.03);
}

.play-overlay {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 60px;
  color: white;
  background: rgba(0, 0, 0, 0.6);
  padding: 20px;
  border-radius: 50%;
  transition: background 0.3s ease;
}

.play-overlay:hover {
  background: rgba(0, 0, 0, 0.8);
}

/* Modal */
.video-modal {
  display: none;
  position: fixed;
  z-index: 9999;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0,0,0,0.95);
}

.video-modal-content {
  position: relative;
  width: 90%;
  height: 90%;
  margin: auto;
  top: 5%;
}

.video-wrapper {
  width: 100%;
  height: 100%;
}

.video-wrapper iframe {
  width: 100%;
  height: 100%;
  border: none;
}

.video-close {
  position: absolute;
  top: -20px;
  right: 0;
  font-size: 40px;
  color: white;
  cursor: pointer;
  z-index: 10;
}
.contact__address ul {
  list-style: none;
  padding-left: 0;
}

.contact__address ul li {
  display: flex;
  align-items: flex-start;
  gap: 15px;
  margin-bottom: 20px;
}

.contact__address ul li i {
  font-size: 22px;
  color: #5c00ce;
  background: #f3e9ff;
  border-radius: 50%;
  width: 45px;
  height: 45px;
  line-height: 45px;
  text-align: center;
}

.contact__address ul li h5 {
  margin: 0;
  font-weight: bold;
}

.contact__form input,
.contact__form textarea {
  width: 100%;
  padding: 12px 15px;
  border: 1px solid #ddd;
  border-radius: 6px;
  font-size: 15px;
}

.contact__form textarea {
  resize: vertical;
  height: 120px;
}

.site-btn {
  background: linear-gradient(to right, #5c00ce, #7e00ad);
  color: #fff;
  padding: 14px 25px;
  border-radius: 6px;
  font-weight: bold;
  border: none;
  transition: 0.3s ease;
}

.site-btn:hover {
  background: #290849;
}
.masonry-wrapper {
  width: 100%;
  overflow: hidden;
  padding-bottom: 0;
  background-color: #fff;
  position: relative;
}

.masonry-grid {
  column-count: 5;
  column-gap: 0;
  width: 100%;
}

.masonry-item {
  position: relative;
  break-inside: avoid;
  overflow: hidden;
  transition: transform 0.3s ease;
}

.masonry-item img {
  width: 100%;
  display: block;
  height: auto;
}

.masonry-item:hover {
  transform: scale(1.01);
}

.masonry-fade {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 80px;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #fff 80%);
  pointer-events: none;
}

.highlight-text {
  padding: 80px 20px 100px;
  text-align: center;
  color: #fff;
  background: linear-gradient(135deg, #2e0c4d 0%, #4a1b87 100%);
  clip-path: polygon(0 0%, 100% 0%, 100% 100%, 0% 100%);
}

.highlight-inner {
  max-width: 900px;
  margin: 0 auto;
}

.highlight-text h3 {
  font-size: 32px;
  font-weight: 700;
  margin-bottom: 20px;
  color: #fff;
}

.highlight-text h3 span {
  color: #b98acd;
}

.highlight-text p {
  font-size: 18px;
  line-height: 1.8;
  color: #f0e6f6;
}

@media (max-width: 1400px) {
  .masonry-grid {
    column-count: 4;
  }
}

@media (max-width: 992px) {
  .masonry-grid {
    column-count: 3;
  }
}

@media (max-width: 768px) {
  .masonry-grid {
    column-count: 2;
  }
}

@media (max-width: 480px) {
  .masonry-grid {
    column-count: 1;
  }
  .highlight-text h3 {
    font-size: 24px;
  }
  .highlight-text p {
    font-size: 16px;
  }
}
.highlight-img-bg {
  position: relative;
  background: #2e0c4d; /* color de fondo base */
  overflow: hidden;
  min-height: 430px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.highlight-img-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url('img/collab-tuchi.jpeg') center center/cover no-repeat;
  opacity: 0.22;
  transition: opacity 0.5s, transform 0.6s cubic-bezier(.25,.1,.25,1);
  z-index: 1;
  filter: grayscale(10%) blur(1px);
}
.highlight-img-bg:hover::before {
  opacity: 0.32;
  transform: scale(1.05);
}
.highlight-img-bg .highlight-inner {
  position: relative;
  z-index: 2;
  max-width: 950px;
  margin: 0 auto;
  padding: 70px 30px 80px;
  text-align: center;
  color: #fff;
}
.highlight-img-bg h3 {
  font-size: 2.3rem;
  font-weight: 700;
  margin-bottom: 16px;
  color: #fff;
  letter-spacing: 1px;
}
.highlight-img-bg h3 span {
  color: #b98acd;
}
.highlight-img-bg p {
  font-size: 1.14rem;
  line-height: 1.7;
  color: #f0e6f6;
  text-shadow: 0 1px 8px #220d2c6e;
}
@media (max-width: 700px) {
  .highlight-img-bg .highlight-inner {
    padding: 32px 8px 40px;
  }
  .highlight-img-bg h3 { font-size: 1.2rem; }
  .highlight-img-bg p { font-size: 0.99rem; }
}
.tuchi-highlight-img {
  max-width: 480px;
  width: 100%;
  border-radius: 18px;
  box-shadow: 0 8px 40px #20084455;
  transition: transform 0.7s cubic-bezier(.19,1,.22,1), box-shadow 0.5s;
  will-change: transform;
  cursor: pointer;
}

.tuchi-highlight-img:hover {
  transform: scale(1.18) rotate(-2deg);
  box-shadow: 0 16px 60px #20084488;
  z-index: 10;
}
.vsco-collage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 99vw;
  max-width: 2100px;
  min-height: 1200px;
  height: 120vh;
  z-index: 1;
  margin: 0;
  overflow: visible;
}

/* Más zoom en todas */
.vsco-img {
  position: absolute;
  border-radius: 18px;
  border: 4px solid #fff;
  box-shadow: 0 8px 40px #0002;
  object-fit: cover;
  cursor: pointer;
  transition:
    transform 0.38s cubic-bezier(.17, .84, .44, 1.09),
    box-shadow 0.36s cubic-bezier(.19,1,.22,1),
    filter 0.3s;
  z-index: 1;
}
.vsco-img:hover {
  transform: scale(1.22) rotate(-3deg)!important;
  z-index: 20;
  box-shadow: 0 20px 60px #2e0c4dcc, 0 2px 32px #fff4;
  filter: brightness(1.07) contrast(1.04);
}

/* Mejora la dispersión para "rellenar" y variar aún más */
.img1  { width:370px; height:170px; top:20px; left:2vw; transform:rotate(-3deg);}
.img2  { width:330px; height:165px; top:55px; left:21vw; transform:rotate(4deg);}
.img3  { width:250px; height:145px; top:12px; left:42vw; transform:rotate(-7deg);}
.img4  { width:285px; height:145px; top:97px; left:60vw; transform:rotate(5deg);}
.img5  { width:220px; height:120px; top:130px; left:81vw; transform:rotate(-8deg);}
.img6  { width:255px; height:130px; top:230px; left:7vw; transform:rotate(10deg);}
.img7  { width:290px; height:140px; top:222px; left:25vw; transform:rotate(-6deg);}
.img8  { width:230px; height:120px; top:245px; left:42vw; transform:rotate(6deg);}
.img9  { width:245px; height:110px; top:265px; left:62vw; transform:rotate(-8deg);}
.img10 { width:275px; height:135px; top:260px; left:80vw; transform:rotate(8deg);}
.img11 { width:220px; height:120px; top:350px; left:14vw; transform:rotate(-3deg);}
.img12 { width:250px; height:135px; top:380px; left:32vw; transform:rotate(-8deg);}
.img13 { width:210px; height:120px; top:380px; left:51vw; transform:rotate(5deg);}
.img14 { width:260px; height:135px; top:430px; left:68vw; transform:rotate(-3deg);}
.img15 { width:220px; height:110px; top:430px; left:88vw; transform:rotate(7deg);}
.img16 { width:230px; height:130px; top:540px; left:10vw; transform:rotate(-5deg);}
.img17 { width:220px; height:115px; top:590px; left:28vw; transform:rotate(7deg);}
.img18 { width:210px; height:120px; top:590px; left:46vw; transform:rotate(-7deg);}
.img19 { width:220px; height:110px; top:620px; left:63vw; transform:rotate(10deg);}
.img20 { width:210px; height:120px; top:670px; left:81vw; transform:rotate(-6deg);}
.img21 { width:250px; height:135px; top:690px; left:20vw; transform:rotate(7deg);}
.img22 { width:210px; height:120px; top:720px; left:38vw; transform:rotate(-8deg);}
.img23 { width:210px; height:130px; top:770px; left:57vw; transform:rotate(8deg);}
.img24 { width:230px; height:110px; top:790px; left:75vw; transform:rotate(-8deg);}
.img25 { width:250px; height:130px; top:850px; left:35vw; transform:rotate(4deg);}
.img26 { width:200px; height:120px; top:860px; left:67vw; transform:rotate(-6deg);}

/* Lightbox/Modal centrado y con animación */
.collage-modal-bg {
  position: fixed; top:0; left:0; width:100vw; height:100vh;
  background: rgba(20,0,40,0.93);
  display: flex; align-items: center; justify-content: center;
  z-index: 5000;
  animation: collageFadeIn 0.23s cubic-bezier(.17, .84, .44, 1.09);
}
@keyframes collageFadeIn { from { opacity:0; } to { opacity:1; } }

.collage-modal-imgbox {
  background: #fff;
  border-radius: 22px;
  box-shadow: 0 16px 80px #000c;
  padding: 16px 16px 12px;
  position: relative;
  display: flex; flex-direction: column; align-items: center;
  max-width: 90vw;
  max-height: 80vh;
  animation: collageZoomIn 0.34s cubic-bezier(.17, .84, .44, 1.09);
}
@keyframes collageZoomIn {
  from { opacity:0; transform: scale(0.6);}
  to   { opacity:1; transform: scale(1);}
}
.collage-modal-imgbox img {
  max-width: 75vw;
  max-height: 67vh;
  border-radius: 16px;
  box-shadow: 0 8px 30px #0006;
  object-fit: contain;
  margin-bottom: 10px;
}
.collage-modal-close {
  position: absolute; top:12px; right:18px;
  font-size: 2.2rem; color:#9e6fd9; cursor:pointer;
  background:none; border:none; outline:none;
  transition: color 0.22s;
}
.collage-modal-close:hover { color: #ff4e92; }

/* Responsive para que nunca se salga */
@media (max-width:1200px) {
  .vsco-collage { height:180vw; min-height:900px;}
}
@media (max-width:800px) {
  .vsco-collage { width:99vw; height:360vw; min-height:800px;}
  .vsco-img { border-width:2px; }
}
@media (max-width:600px) {
  .vsco-collage { height:410vw; min-height:600px;}
  .collage-modal-imgbox img { max-width: 97vw; }
}
@media (max-width: 900px) {
  .vsco-collage {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 3vw 2vw;
    padding: 3vw 0 10vw 0;
    left: 0 !important;
    transform: none !important;
    min-height: unset !important;
    justify-items: center;
    width: 100vw;
  }
  .vsco-img {
    position: static !important;
    transform: none !important;
    width: 92vw !important;
    max-width: 99vw;
    min-width: 0 !important;
    height: auto !important;
    margin: 0 0 5vw 0 !important;
    border-radius: 14px !important;
    box-shadow: 0 4px 16px #0001;
    z-index: 1 !important;
  }
}
@media (max-width: 600px) {
  .vsco-collage {
    grid-template-columns: 1fr;
    gap: 4vw 0;
    padding-bottom: 20vw;
  }
  .vsco-img {
    width: 98vw !important;
    margin: 0 0 6vw 0 !important;
  }
}
/* --- Ajustes para portada y menú móvil --- */
@media (max-width: 600px) {
  /* Hero portada */
  .hero.spad {
    min-height: 80vh;
    padding: 0 !important;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    position: relative;
    background-size: cover !important;
    background-position: center center !important;
  }
  .hero__text {
    width: 100%;
    padding: 2.5rem 1.2rem 2rem 1.2rem;
    background: linear-gradient(180deg, rgba(44,6,70,0) 10%, rgba(44,6,70,0.92) 85%);
    border-radius: 0 0 24px 24px;
    position: absolute;
    left: 0;
    bottom: 0;
    text-align: center;
    z-index: 2;
  }
  .hero__text h1 {
    font-size: 2.4rem;
    margin: 0.5rem 0 1.2rem 0;
    line-height: 1.1;
    letter-spacing: 1px;
    color: #fff;
    font-weight: bold;
  }
  .linear__icon {
    font-size: 2rem;
    position: absolute;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
    color: #c3a7ea;
    z-index: 4;
  }
  /* Menú principal */
  .header {
    padding: 1rem 0 0.3rem 0 !important;
    background: #2e0c4d !important;
    box-shadow: 0 4px 22px #20084433;
  }
  .header__nav {
    justify-content: space-between !important;
    padding: 0 5px;
  }
  .header__logo img {
    width: 56px !important;
    height: auto;
    margin: 0;
  }
  .header__menu.mobile-menu ul {
    background: #2e0c4d !important;
    border-radius: 18px;
    box-shadow: 0 12px 38px #20084477;
    margin-top: 1.5rem !important;
    padding: 0.8rem 0;
  }
  .header__menu.mobile-menu ul li a {
    font-size: 1.18rem;
    padding: 0.8rem 0;
    color: #fff !important;
    border-bottom: 1px solid #46226644;
    transition: background 0.2s;
  }
  .header__menu.mobile-menu ul li:last-child a {
    border-bottom: none;
  }
  /* Elimina margen/scroll lateral */
  html, body {
    overflow-x: hidden !important;
  }
}

/* Ajusta la sección "About" en móvil */
@media (max-width: 600px) {
  .about .row {
    flex-direction: column !important;
  }
  .about__pic img {
    width: 100%;
    border-radius: 18px;
    margin-bottom: 1rem;
  }
  .about__text {
    padding: 1.3rem 0.8rem;
    text-align: center;
  }
  .about__text h2 {
    font-size: 1.7rem;
    margin-bottom: 0.8rem;
  }
  .about__text p {
    font-size: 1.09rem;
    line-height: 1.55;
  }
  .primary-btn {
    margin-top: 1.3rem;
    font-size: 1.12rem;
    padding: 0.8rem 2.5rem;
  }
}
@media (max-width: 700px) {
  /* Oculta menú horizontal, solo muestra menú hamburguesa */
  .header__menu,
  .header__menu.mobile-menu {
    display: none !important;
  }
  /* Si usas un botón de hamburguesa personalizado, asegúrate que sí se vea */
  .slicknav_menu {
    display: block !important;
  }
  /* Opcional: Ajusta el logo y el menú para centrar si hace falta */
  .header__logo {
    margin: 0 auto !important;
    text-align: left;
  }
  /* Ajusta el header para que no quede doble barra */
  .header {
    padding-bottom: 0.4rem !important;
    min-height: 62px;
  }
}
.footer__social {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  float: none !important;
}

.footer__social__links {
  display: flex !important;
  justify-content: center !important;
  gap: 30px;
  margin-top: 24px;
}

.footer__social__links a {
  display: flex;
  align-items: center;
  justify-content: center;
}

.footer__social h2 {
  text-align: center;
  margin: 0 auto 0.8em auto;
}

.footer__copyright__text {
  text-align: center !important;
  margin: 2em auto 0 auto !important;
  width: 100%;
  display: block;
}

@media (max-width: 700px) {
  .footer__social,
  .footer__social__links {
    justify-content: center !important;
    text-align: center !important;
  }
  .footer__social h2 {
    text-align: center !important;
    font-size: 1.5em !important;
  }
}
@media (max-width: 700px) {
  /* Header sin fondo morado */
  .header,
  .header--normal {
    background: #fff !important;
    background-color: #fff !important;
    box-shadow: none !important;
  }
  /* Quitar fondos decorativos del header si existen */
  .set-bg.header--normal {
    background: #fff !important;
    background-image: none !important;
  }
  /* Breadcrumb sin morado */
  .breadcrumb-option {
    background: #fff !important;
    background-color: #fff !important;
    border: none;
  }
  /* Quita padding extra arriba si hace falta */
  .header__nav {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
  }
}
@media (max-width: 700px) {
  .header,
  .header--normal,
  .set-bg.header--normal {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
  }
  /* Breadcrumb sin fondo */
  .breadcrumb-option {
    background: transparent !important;
    background-color: transparent !important;
    border: none;
  }
}
@media (max-width: 700px) {
  .header__menu {
    background: transparent !important;
  }
  .header__menu .fa {
    color: #6c2eb6 !important; /* O el color que quieras para el icono de menú */
  }
}
/* Estilo para el menú mobile más elegante */
@media (max-width: 900px) {
  .slicknav_menu {
    background: transparent !important;
    box-shadow: none !important;
  }
  .slicknav_nav {
    background: rgba(32, 8, 68, 0.80) !important; /* Fondo morado traslúcido */
    backdrop-filter: blur(8px);
    border-radius: 0 0 24px 24px;
    margin-top: 20px;
    box-shadow: 0 8px 32px #20084444;
    animation: menuFadeIn 0.4s cubic-bezier(.18,.89,.32,1.28);
  }
  .slicknav_nav a {
    color: #fff !important;
    font-size: 1.2em;
    font-weight: 600;
    padding: 18px 30px !important;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    transition: background .3s, color .3s;
  }
  .slicknav_nav a:hover {
    background: rgba(255,255,255,0.08);
    color: #b98acd !important;
  }
  .slicknav_open { animation: menuFadeIn 0.3s; }
  @keyframes menuFadeIn {
    from { opacity: 0; transform: translateY(-30px);}
    to   { opacity: 1; transform: translateY(0);}
  }
}
/* Espacio elegante entre la imagen principal y la sección About */
.hero + .about {
  margin-top: 80px;
}
@media (max-width: 900px) {
  .hero + .about {
    margin-top: 44px;
  }
}
/* Offcanvas menu estilos */
.offcanvas-menu {
  position: fixed;
  top: 0;
  right: -350px;
  width: 320px;
  height: 100vh;
  background: #3c206e;
  color: #fff;
  box-shadow: -8px 0 24px rgba(0,0,0,0.18);
  z-index: 9999;
  padding: 32px 28px;
  transition: right 0.38s cubic-bezier(.77,0,.18,1);
  display: flex;
  flex-direction: column;
  border-radius: 16px 0 0 16px;
}
.offcanvas-menu ul {
  list-style: none;
  padding: 0;
  margin-top: 48px;
}
.offcanvas-menu ul li {
  margin-bottom: 22px;
}
.offcanvas-menu ul li a {
  color: #fff;
  font-size: 1.23rem;
  font-weight: bold;
  text-decoration: none;
  transition: color 0.2s;
  letter-spacing: .5px;
}
.offcanvas-menu ul li a:hover {
  color: #d0b3ff;
}
.close-btn {
  background: none;
  border: none;
  font-size: 2.1rem;
  color: #fff;
  cursor: pointer;
  position: absolute;
  top: 18px;
  right: 22px;
  z-index: 10000;
}
.offcanvas-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(30, 18, 56, 0.23);
  z-index: 9998;
  display: none;
  transition: opacity 0.3s;
}
.offcanvas-menu.open {
  right: 0;
}
.offcanvas-backdrop.open {
  display: block;
}
@media (max-width: 400px){
  .offcanvas-menu {width:92vw;min-width:180px;}
}
/* SOLO AFECTA MENÚ EN MÓVIL */
@media (max-width:991px) {
  .header__menu, .slicknav_menu, #mobile-menu-wrap { display: none !important; }
  .offcanvas-menu {
    position: fixed; top: 0; right: -320px; width: 90vw; max-width: 340px; height: 100vh;
    background: #3c206e; color: #fff; z-index: 9999; padding: 40px 30px 20px 30px;
    box-shadow: -6px 0 20px #0002; border-radius: 18px 0 0 18px;
    transition: right .39s cubic-bezier(.75,0,.22,1);
    display: flex; flex-direction: column; align-items: flex-start;
  }
  .offcanvas-menu.open { right: 0; }
  .offcanvas-menu .close-btn {
    background: none; border: none; font-size: 2rem; color: #fff;
    position: absolute; top: 18px; right: 26px; z-index: 10001; cursor: pointer;
  }
  .offcanvas-menu ul {list-style:none;padding:0;margin:46px 0 0 0;width:100%;}
  .offcanvas-menu ul li {margin-bottom: 24px;}
  .offcanvas-menu ul li a {
    color: #fff; font-size: 1.2rem; font-weight: 600; text-decoration: none;
    display: block; padding: 7px 0 7px 4px; border-radius: 8px; transition:background .22s;
  }
  .offcanvas-menu ul li a:hover { background: #56308e; }
  .offcanvas-backdrop {
    position: fixed; inset: 0; z-index: 9998;
    background: rgba(30,18,56,.21); display: none;
    transition: opacity .25s;
  }
  .offcanvas-backdrop.open { display: block; }
  .menu-btn-mobile { /* solo visible en móvil */
    display: block !important; position: fixed; top: 25px; right: 18px; z-index: 11000;
    padding: 13px 22px; background: #7018d8; color: #fff; font-size: 1.14rem;
    border: none; border-radius: 8px; font-weight: bold; letter-spacing: 1px;
    box-shadow: 0 2px 16px #0001; cursor: pointer;
  }
}
/* Esconde el botón menú en desktop */
@media (min-width:992px) { .menu-btn-mobile {display:none !important;} }
/* Collage radial web */
@media (min-width: 900px) {
  .collage-radial {
    position: relative;
    min-height: 820px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 70px 0 90px 0;
  }
  .collage-title-center {
    position: absolute;
    left: 50%; top: 50%;
    transform: translate(-50%,-50%);
    z-index: 4;
    font-family: 'Rajdhani',sans-serif;
    font-weight: 700;
    font-size: 2.8rem;
    color: #1B0437;
    text-align: center;
    background: #fff9;
    border-radius: 32px;
    box-shadow: 0 4px 60px #0002;
    padding: 35px 65px 30px 65px;
    letter-spacing: 2px;
    border-bottom: 6px solid #731BBA55;
    border-top: 3px solid #c8bbeb44;
  }
  .collage-radial .vsco-img {
    position: absolute;
    border-radius: 18px;
    box-shadow: 0 8px 32px #0003;
    transition: transform .4s cubic-bezier(.44,1.3,.62,1.08), box-shadow .28s;
    object-fit: cover;
    width: 320px; height: 192px;
    cursor: pointer;
    z-index: 2;
  }
  /* Puedes ajustar los ángulos/distancias para otras fotos! */
  .img1  { left:8%;  top:10%;  transform: rotate(-7deg);}
  .img2  { left:27%; top:6%;   transform: rotate(9deg);}
  .img3  { left:66%; top:12%;  transform: rotate(6deg);}
  .img5  { left:77%; top:32%;  transform: rotate(-6deg);}
  .img7  { left:80%; top:55%;  transform: rotate(-14deg);}
  .img9  { left:63%; top:65%;  transform: rotate(7deg);}
  .img10 { left:42%; top:68%;  transform: rotate(-8deg);}
  .img11 { left:22%; top:66%;  transform: rotate(8deg);}
  .img12 { left:7%;  top:52%;  transform: rotate(-6deg);}
  .img14 { left:19%; top:33%;  transform: rotate(-12deg);}
  .img15 { left:60%; top:39%;  transform: rotate(8deg);}
  .img18 { left:40%; top:29%;  transform: rotate(-13deg);}
  .collage-radial .vsco-img:hover {
    z-index: 10;
    box-shadow: 0 12px 60px #0007;
    transform: scale(1.11) rotate(-1deg) !important;
  }
}
/* En móvil: feed vertical normal */
@media (max-width: 899px) {
  .collage-radial {
    display: flex; flex-direction: column; align-items: center;
    gap: 16px; margin: 20px 0;
  }
  .collage-title-center { 
    position: static;
    margin-bottom: 20px;
    background: transparent;
    box-shadow: none;
    border: none;
    padding: 0;
    font-size: 2rem;
    color: #1B0437;
  }
  .collage-radial .vsco-img {
    position: static;
    width: 96vw;
    max-width: 440px;
    height: auto;
    aspect-ratio: 16/10;
    margin: 0 auto;
    border-radius: 18px;
    box-shadow: 0 2px 14px #0002;
    margin-bottom: 6px;
    transition: transform .16s;
  }
  .collage-radial .vsco-img:hover { transform: scale(1.05);}
}
.participaciones-destacadas-section {
  background: linear-gradient(90deg, #33135a 60%, #210b37 100%);
  padding: 60px 0 60px 0;
  color: #fff;
}
.participaciones-flex {
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 1200px;
  margin: auto;
  gap: 60px;
}
.participaciones-texto {
  flex: 1.2;
  min-width: 280px;
}
.participaciones-texto h3 {
  font-family: 'Rajdhani', sans-serif;
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 12px;
  color: #fff;
}
.participaciones-texto span {
  color: #ad8cd3;
  font-weight: 600;
}
.participaciones-texto p {
  font-size: 1.3rem;
  line-height: 1.5;
  color: #e7e3f7;
}
.participaciones-img {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.participaciones-img img {
  max-width: 360px;
  width: 100%;
  border-radius: 22px;
  box-shadow: 0 8px 38px #0004;
  transition: transform 0.4s cubic-bezier(.33,1.52,.51,.93);
}
.participaciones-img img:hover {
  transform: scale(1.05) rotate(-2deg);
}
@media (max-width: 900px) {
  .participaciones-flex {
    flex-direction: column;
    gap: 32px;
    padding: 0 14px;
  }
  .participaciones-texto h3 { font-size: 1.5rem; }
  .participaciones-texto p { font-size: 1rem;}
  .participaciones-img img { max-width: 96vw; }
  .participaciones-destacadas-section { padding: 30px 0; }
}
.collage-moodboard {
  width: 100vw;
  min-height: 80vh;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  gap: 0px;
  background: #f7e3ce;
  padding: 64px 0 32px 0;
  position: relative;
  overflow-x: hidden;
}

.collage-mood-title {
  position: absolute;
  top: 24px;
  left: 50%;
  transform: translateX(-50%) rotate(-2deg);
  background: #fff5e6;
  padding: 14px 48px 10px 48px;
  border-radius: 16px;
  font-family: 'Rajdhani',sans-serif;
  font-size: 2.7rem;
  font-weight: 700;
  letter-spacing: 2px;
  color: #77442d;
  box-shadow: 0 3px 30px #77543c24;
  border: 2.5px solid #d4b08c;
  z-index: 4;
  opacity: 0.97;
  box-decoration-break: clone;
  text-align: center;
  margin-bottom: 24px;
  pointer-events: none;
}

.polaroid-collage {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 100vw;
  max-width: 1250px;
  margin: 0 auto;
  gap: 0;
}

.polaroid {
  position: absolute;
  background: #fff;
  box-shadow: 0 6px 36px 0 #4442  , 0 2px 8px #0001;
  border-radius: 13px;
  border: 2px solid #e6dacd;
  width: 220px;
  height: 160px;
  padding: 0.6rem 0.6rem 1.5rem 0.6rem;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  cursor: pointer;
  transition: transform 0.2s cubic-bezier(.66,0,.43,1.04), box-shadow 0.25s;
  z-index: 2;
}

.polaroid img {
  width: 100%;
  height: 120px;
  object-fit: cover;
  border-radius: 7px;
  box-shadow: 0 2px 16px #ad83513a;
  background: #f5eee5;
  transition: transform 0.2s cubic-bezier(.66,0,.43,1.04);
}

.polaroid:hover,
.polaroid:focus {
  z-index: 10;
  transform: scale(1.13) rotate(-2deg);
  box-shadow: 0 12px 46px 0 #dba65c90, 0 4px 28px #0002;
}

.polaroid:after {
  content: "";
  display: block;
  position: absolute;
  left: 12px;
  top: 10px;
  width: 24px;
  height: 16px;
  background: #ffedb3;
  opacity: 0.23;
  z-index: 2;
  transform: rotate(-7deg);
  border-radius: 5px;
  box-shadow: 0 0 0 0;
}

.polaroid .caption {
  font-size: 1.09rem;
  color: #855c38;
  text-align: center;
  margin-top: 3px;
  font-family: 'Rajdhani',sans-serif;
  font-weight: 500;
  opacity: 0.8;
  letter-spacing: 0.2px;
  width: 100%;
}

@media (max-width: 900px) {
  .polaroid {
    width: 40vw;
    height: 29vw;
    min-width: 148px;
    min-height: 120px;
    padding: 0.6rem 0.5rem 1.2rem 0.5rem;
  }
  .collage-mood-title {
    font-size: 2rem;
    padding: 12px 16px;
  }
}
@media (max-width: 700px) {
  .collage-moodboard {
    flex-direction: column;
    align-items: center;
    min-height: unset;
    padding: 40px 0 32px 0;
  }
  .collage-mood-title {
    position: static;
    transform: none;
    margin-bottom: 22px;
    margin-top: 12px;
  }
  .polaroid-collage {
    position: static;
    flex-direction: column;
    gap: 20px 0;
    width: 98vw;
    max-width: 99vw;
  }
  .polaroid {
    position: static;
    width: 95vw;
    height: 38vw;
    min-width: 140px;
    min-height: 120px;
    margin: 0 auto 20px auto;
    transform: none !important;
    box-shadow: 0 6px 36px 0 #4442;
  }
}
/* Offcanvas Menu: mueve la X a la izquierda */
.offcanvas-menu .close-btn {
  position: absolute;
  left: 16px;
  top: 14px;
  font-size: 2.3rem;
  background: none;
  border: none;
  color: #7c2be6;
  font-weight: bold;
  cursor: pointer;
  z-index: 1001;
  transition: color 0.2s;
}

.offcanvas-menu {
  position: fixed;
  top: 0;
  left: 0;
  width: 82vw;
  max-width: 350px;
  height: 100vh;
  background: #250845fa;
  box-shadow: 6px 0 38px #0007;
  z-index: 9999;
  padding-top: 60px;
  transform: translateX(-110%);
  transition: transform 0.35s cubic-bezier(.7,.2,.4,1.12);
  /* ...resto de tu estilo */
}
.offcanvas-menu.open {
  transform: translateX(0);
}
/* Bloque colaboraciones aesthetich */
.participaciones-destacadas-section {
  background: linear-gradient(120deg, #2a0e4c 70%, #44206c 100%);
  color: #fff;
  padding: 80px 0 40px 0;
}
.participaciones-flex {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 48px;
  max-width: 1100px;
  margin: 0 auto;
  flex-wrap: wrap;
}
.participaciones-texto h3 {
  font-size: 2.6rem;
  font-family: 'Rajdhani', sans-serif;
  font-weight: bold;
  margin-bottom: 0.2em;
}
.participaciones-texto span {
  color: #a080bc;
  font-size: 1.4rem;
  font-weight: 600;
}
.participaciones-texto p {
  font-size: 1.2rem;
  font-family: 'Rajdhani', sans-serif;
  margin: 1em 0 0 0;
  color: #fff;
}
.participaciones-img img {
  max-width: 340px;
  width: 100%;
  border-radius: 22px;
  box-shadow: 0 8px 38px #0004;
}

.collage-moodboard {
  background: #fae5d3;
  padding: 100px 0 90px 0;
  position: relative;
  overflow: hidden;
}
.collage-mood-title {
  display: block;
  font-family: 'Rajdhani', sans-serif;
  font-size: 2.7rem;
  font-weight: bold;
  letter-spacing: 1px;
  color: #7c5541;
  background: #fff6e5;
  box-shadow: 0 2px 14px #0001;
  width: 380px;
  margin: 0 auto 35px auto;
  text-align: center;
  padding: 18px 0 12px 0;
  border-radius: 18px;
  transform: rotate(-5deg);
  position: relative;
  z-index: 2;
  border: 3px solid #ecd1b0;
}

.polaroid-collage {
  position: relative;
  width: 88vw;
  height: 470px;
  max-width: 1200px;
  margin: 0 auto;
  min-height: 370px;
}
.polaroid {
  position: absolute;
  width: 215px;
  background: #fff;
  padding: 12px 14px 32px 14px;
  border-radius: 17px;
  box-shadow: 0 7px 42px #9a6e3b28, 0 2px 18px #7e539e13;
  transition: transform 0.17s cubic-bezier(.46,1.3,.62,.98), box-shadow 0.15s;
  cursor: pointer;
  border: 2.5px solid #e3d6c1;
  z-index: 1;
}
.polaroid:hover {
  transform: scale(1.13) rotate(-2deg) !important;
  z-index: 99;
  box-shadow: 0 8px 45px #aa8fb55c, 0 2px 30px #643f8b18;
}
.polaroid img {
  display: block;
  width: 100%;
  aspect-ratio: 1.32/1;
  object-fit: cover;
  border-radius: 8px;
  box-shadow: 0 2px 7px #5d398217;
}
.polaroid .caption {
  margin-top: 12px;
  text-align: right;
  color: #a3887e;
  font-family: 'Rajdhani', sans-serif;
  font-size: 1.15rem;
  letter-spacing: 1px;
  font-weight: 600;
  padding-right: 4px;
  text-shadow: 0 2px 10px #fff5;
}

/* Mobile */
@media (max-width: 900px) {
  .participaciones-flex { flex-direction: column; gap: 36px; padding: 0 12px; }
  .polaroid-collage { width: 98vw; height: 520px; }
}
@media (max-width: 700px) {
  .participaciones-flex { gap: 20px; }
  .participaciones-img img { max-width: 93vw; }
  .collage-mood-title { font-size: 1.3rem; width: 95vw; }
  .polaroid-collage {
    position: static;
    width: 100vw;
    height: auto;
    min-height: unset;
    display: flex;
    flex-wrap: wrap;
    gap: 12px 6vw;
    justify-content: center;
    padding: 18px 0 0 0;
  }
  .polaroid {
    position: static;
    width: 44vw;
    margin-bottom: 12px;
    transform: none !important;
  }
}
/* --- COLLAGE MOOBOARD ALTO Y ESTILO AESTHETIC --- */
.collage-moodboard-v2 {
  background: #f7e3ce;
  min-height: 80vh;
  width: 100vw;
  padding: 80px 0 0 0;
  position: relative;
  overflow-x: hidden;
  overflow-y: visible;
  z-index: 1;
}
.collage-mood-title-v2 {
  position: absolute;
  left: 50%;
  top: 34px;
  transform: translateX(-50%) rotate(-5deg);
  font-family: 'Rajdhani', sans-serif;
  font-weight: 700;
  font-size: 2.8rem;
  color: #7c5541;
  background: #fff6e5;
  padding: 20px 60px 14px 60px;
  border-radius: 18px;
  box-shadow: 0 3px 30px #77543c24;
  border: 2.5px solid #d4b08c;
  z-index: 5;
  opacity: 0.98;
  text-align: center;
  pointer-events: none;
}
.polaroid-collage-v2 {
  position: relative;
  width: 94vw;
  max-width: 1700px;
  height: 55vw;  /* Aumenta altura! */
  min-height: 650px;
  margin: 110px auto 0 auto;
  z-index: 2;
}
.polaroid-v2 {
  position: absolute;
  width: 350px;
  height: 250px;
  background: #fff;
  padding: 16px 16px 34px 16px;
  border-radius: 18px;
  box-shadow: 0 8px 38px #835e3e30, 0 2px 18px #7e539e13;
  transition: transform 0.23s cubic-bezier(.46,1.3,.62,.98), box-shadow 0.19s;
  border: 2.5px solid #e3d6c1;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.polaroid-v2 img {
  display: block;
  width: 100%;
  height: 172px;
  object-fit: cover;
  border-radius: 10px;
  box-shadow: 0 3px 18px #d0b99718;
}
.polaroid-v2 .caption-v2 {
  margin-top: 12px;
  text-align: right;
  color: #a3887e;
  font-family: 'Rajdhani', sans-serif;
  font-size: 1.13rem;
  letter-spacing: 1px;
  font-weight: 600;
  width: 100%;
  padding-right: 4px;
  text-shadow: 0 2px 10px #fff5;
}
.polaroid-v2:hover {
  transform: scale(1.16) rotate(-3deg) !important;
  z-index: 99;
  box-shadow: 0 8px 45px #aa8fb55c, 0 2px 30px #643f8b18;
}

/* --- DIFUMINADO ABAJO DEL COLLAGE --- */
.gradient-bottom-fade {
  position: absolute;
  left: 0; bottom: -1px; width: 100%; height: 88px;
  background: linear-gradient(180deg, rgba(247,227,206,0) 0%, #f7e3ce 50%, #f7e3ce 100%);
  z-index: 10;
  pointer-events: none;
}

/* --- GRADIENTE TRANSICIÓN HACIA TEXTO --- */
.to-text-gradient {
  width: 100vw;
  height: 72px;
  background: linear-gradient(180deg, #f7e3ce 5%, #2a0e4c 95%);
}

/* --- TEXTO + IMAGEN --- */
.participaciones-destacadas-section-v2 {
  background: linear-gradient(120deg, #2a0e4c 70%, #44206c 100%);
  color: #fff;
  padding: 85px 0 60px 0;
  position: relative;
  z-index: 10;
}
.participaciones-flex {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 54px;
  max-width: 1200px;
  margin: 0 auto;
  flex-wrap: wrap;
}
.participaciones-texto h3 {
  font-size: 2.5rem;
  font-family: 'Rajdhani', sans-serif;
  font-weight: bold;
  margin-bottom: 0.2em;
}
.participaciones-texto span {
  color: #a080bc;
  font-size: 1.3rem;
  font-weight: 600;
}
.participaciones-texto p {
  font-size: 1.1rem;
  font-family: 'Rajdhani', sans-serif;
  margin: 1em 0 0 0;
  color: #fff;
}
.participaciones-img img {
  max-width: 380px;
  width: 100%;
  border-radius: 22px;
  box-shadow: 0 8px 38px #0004;
}

/* --- DIFUMINADO ABAJO (A MORADO) --- */
.to-purple-gradient {
  width: 100vw;
  height: 65px;
  background: linear-gradient(180deg, #2a0e4c 2%, #1b0437 98%);
}

/* --- Responsive: móvil --- */
@media (max-width: 1200px) {
  .polaroid-collage-v2 { height: 85vw; min-height: 500px;}
}
@media (max-width: 900px) {
  .collage-moodboard-v2 { padding: 50px 0 0 0;}
  .polaroid-collage-v2 { height: 120vw; min-height: 400px;}
  .polaroid-v2 { width: 48vw; height: 33vw; min-width: 180px; min-height: 145px;}
  .polaroid-v2 img { height: 18vw; min-height: 82px;}
}
@media (max-width: 700px) {
  .collage-moodboard-v2 { min-height: 46vh; padding-top: 28px;}
  .collage-mood-title-v2 { font-size: 1.3rem; padding: 10px 14px; }
  .polaroid-collage-v2 { 
    height: auto;
    min-height: unset;
    width: 100vw;
    margin-top: 50px;
    display: flex;
    flex-wrap: wrap;
    gap: 12px 6vw;
    justify-content: center;
    align-items: center;
  }
  .polaroid-v2 { position: static; width: 88vw; height: 40vw; margin-bottom: 12px; }
  .polaroid-v2 img { height: 28vw;}
  .gradient-bottom-fade { height: 50px;}
  .to-text-gradient { height: 38px;}
  .participaciones-flex { flex-direction: column; gap: 20px;}
  .participaciones-img img { max-width: 93vw; }
  .participaciones-destacadas-section-v2 { padding: 35px 0 22px 0;}
}
.collage-moodboard-v3 {
  width: 100vw;
  min-height: 74vh;
  position: relative;
  background: #f7e3ce;
  padding: 70px 0 60px 0;
  overflow: hidden;
  z-index: 2;
  display: block;
}

.collage-img {
  position: absolute;
  object-fit: cover;
  box-shadow: 0 8px 32px #0002;
  transition: transform 0.38s cubic-bezier(.22,.99,.32,1.09), box-shadow 0.3s;
  z-index: 2;
  cursor: pointer;
}

/* Ejemplo de posiciones y tamaños (ajusta a tus fotos y prueba!) */
.img1 { width: 340px; height: 220px; top: 4vw; left: 6vw; border-radius: 32px; transform: rotate(-7deg);}
.img2 { width: 270px; height: 280px; top: 2vw; left: 29vw; border-radius: 45% 18% 36% 31%; transform: rotate(12deg);}
.img3 { width: 390px; height: 215px; top: 12vw; left: 60vw; border-radius: 38px; transform: rotate(-8deg);}
.img4 { width: 215px; height: 230px; top: 3vw; left: 70vw; border-radius: 15px 28px 32px 17px; transform: rotate(5deg);}
.img5 { width: 350px; height: 200px; top: 18vw; left: 10vw; border-radius: 41% 23% 38% 29%; transform: rotate(-13deg);}
.img6 { width: 210px; height: 210px; top: 18vw; left: 37vw; border-radius: 50%; border: 7px solid #fff6e5; box-shadow: 0 8px 36px #b77e2e15;}
.img7 { width: 290px; height: 200px; top: 20vw; left: 61vw; border-radius: 32px 44px 20px 40px; transform: rotate(7deg);}
.img8 { width: 170px; height: 190px; top: 31vw; left: 21vw; border-radius: 24px 52px 18px 37px; border: 6px solid #e1c19a;}
.img9 { width: 220px; height: 230px; top: 32vw; left: 49vw; border-radius: 19px 45px 31px 25px; transform: rotate(-12deg);}
.img10{ width: 280px; height: 170px; top: 31vw; left: 71vw; border-radius: 32px; box-shadow: 0 8px 26px #77543c2a; transform: rotate(6deg); }

/* Marcos y variaciones */
.round { border-radius: 48% 20% 50% 35%; }
.round2 { border-radius: 35px 65px 36px 26px; }
.circle { border-radius: 50%; border: 8px solid #fff7ee; }
.shadow { box-shadow: 0 16px 50px #7e3e2b24; }
.soft-shadow { box-shadow: 0 5px 40px #a9844722; }
.frame { border: 7px solid #eed4b3; }
.polaroid { border-radius: 12px; box-shadow: 0 9px 45px #b28b5a24, 0 2px 8px #fff4; background: #fff8e5; padding: 6px; }

.collage-img:hover {
  transform: scale(1.12) rotate(-2deg)!important;
  z-index: 12;
  box-shadow: 0 16px 60px #2e0c4dcc, 0 2px 32px #fff6;
  filter: brightness(1.07) contrast(1.05);
}

/* --- Responsive (móvil): Apila en vertical --- */
@media (max-width: 950px) {
  .collage-moodboard-v3 {
    height: auto;
    min-height: unset;
    padding: 40px 0 20vw 0;
    display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
  }
  .collage-img {
    position: static !important;
    width: 89vw !important;
    height: 52vw !important;
    max-width: 390px;
    max-height: 330px;
    margin: 5vw 0 0 0;
    transform: none !important;
    border-radius: 26px !important;
    box-shadow: 0 6px 24px #ab8c7a22;
  }
}

/* Mejora la transición a la siguiente sección */
.to-text-gradient {
  width: 100vw;
  height: 80px;
  background: linear-gradient(180deg, #f7e3ce 10%, #2a0e4c 95%);
  z-index: 20;
}
.collage-gradient-top {
  width: 100vw;
  height: 90px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8;
  pointer-events: none;
  background: linear-gradient(180deg, #f7e3ce 65%, #f7e3ce00 100%);
}
.collage-gradient-bottom {
  width: 100vw;
  height: 100px;
  position: relative;
  z-index: 8;
  pointer-events: none;
  background: linear-gradient(0deg, #2a0e4c 35%, #2a0e4c00 100%);
  margin-top: -80px;
}
.collage-moodboard-v3 {
  width: 100vw;
  min-height: 93vh;
  position: relative;
  background: #f7e3ce;
  padding: 110px 0 110px 0;
  overflow: visible;
  z-index: 3;
  display: block;
}

.collage-img {
  position: absolute;
  object-fit: cover;
  box-shadow: 0 8px 30px #0002;
  transition: 
    transform 0.37s cubic-bezier(.22,.99,.32,1.09), 
    box-shadow 0.25s, 
    filter 0.22s;
  z-index: 2;
  cursor: pointer;
  border-radius: 2.6em 1.2em 2.1em 1.6em / 2em 2.2em 1.8em 2em;
  background: #fff;
}

.collage-img:hover {
  z-index: 10;
  box-shadow: 0 14px 90px #6c3c8dcc, 0 0 0 7px #7f6aaf28;
  filter: brightness(1.10) contrast(1.14) saturate(1.11) blur(0.5px);
  background: #4f3475;
}

/* --- POSICIONES Y FORMAS. AJUSTA SI QUIERES --- */
.img1  { width:350px; height:220px; top:32px; left:7vw; border-radius: 48px 88px 38px 48px; }
.img2  { width:260px; height:250px; top:40px; left:29vw; border-radius: 90px 46px 110px 60px; }
.img3  { width:340px; height:210px; top:110px; left:55vw; border-radius: 36px 70px 28px 60px; }
.img4  { width:180px; height:220px; top:30px; left:74vw; border-radius: 50% 45% 32% 35%/38% 41% 50% 44%; }
.img5  { width:320px; height:190px; top:315px; left:13vw; border-radius: 50% 38% 45% 35%/45% 43% 47% 45%; }
.img6  { width:170px; height:180px; top:325px; left:39vw; border-radius: 48% 48% 50% 50%; border: 7px solid #fff6e5;}
.img7  { width:290px; height:180px; top:330px; left:58vw; border-radius: 65px 44px 40px 65px;}
.img8  { width:180px; height:180px; top:540px; left:25vw; border-radius: 49% 39% 48% 42%/49% 44% 50% 42%;}
.img9  { width:220px; height:190px; top:540px; left:48vw; border-radius: 30% 60% 60% 30%/50% 60% 40% 60%; }
.img10 { width:250px; height:160px; top:560px; left:71vw; border-radius: 36px 68px 38px 60px; }
.img11 { width:250px; height:170px; top:450px; left:72vw; border-radius: 52px 35px 44px 54px; }

/* RESPONSIVE: en móvil apila, nunca corta */
@media (max-width: 990px) {
  .collage-moodboard-v3 {
    min-height: unset;
    height: auto;
    padding: 32px 0 60vw 0;
    display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
    background: #f7e3ce;
  }
  .collage-img {
    position: static !important;
    width: 88vw !important;
    height: 52vw !important;
    max-width: 380px;
    max-height: 320px;
    margin: 6vw 0 0 0;
    border-radius: 32px !important;
    box-shadow: 0 6px 20px #a97e8b18;
    background: #fff;
  }
  .collage-gradient-top, .collage-gradient-bottom { position: static; height: 44px;}
}
@media (max-width: 700px) {
  .about__pic {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    margin-bottom: 1.3em;
    text-align: center;
  }
  .about__pic img {
    margin: 0 auto !important;
    display: block !important;
    width: 94vw !important;
    max-width: 380px !important;
    border-radius: 22px !important;
    box-shadow: 0 8px 38px #0004;
  }
}
.collage-moodboard-v4 {
  position: relative;
  min-height: 600px;
  width: 100vw;
  max-width: 1600px;
  margin: 0 auto;
  background: #f6deca;
  overflow: visible;
  padding-bottom: 120px;
  padding-top: 32px;
  display: block;
}
.collage-moodboard-v4 .collage-img {
  position: absolute;
  object-fit: cover;
  box-shadow: 0 8px 38px #0002, 0 2px 20px #0001;
  border-radius: 22px;
  transition: 
    transform 0.35s cubic-bezier(.44,1.3,.62,1.08),
    box-shadow 0.21s,
    filter 0.17s;
  cursor: pointer;
  border: 4px solid #fff7;
}
.collage-moodboard-v4 .collage-img:hover {
  z-index: 10;
  transform: scale(1.11) rotate(-1deg);
  filter: brightness(1.08) saturate(1.11) drop-shadow(0 0 30px #c89d62cc);
  box-shadow: 0 12px 52px #aa8fb566, 0 2px 36px #643f8b14;
}

/* Tamaños, formas y posiciones distintas en web */
.collage-shape-1  { left: 5vw;   top: 30px;  width: 320px; height: 195px; border-radius: 42px 30px 32px 54px/36px 42px 52px 29px; transform: rotate(-7deg);}
.collage-shape-2  { left: 26vw;  top: 0;     width: 230px; height: 230px; border-radius: 50%; transform: rotate(6deg);}
.collage-shape-3  { left: 46vw;  top: 55px;  width: 285px; height: 185px; border-radius: 33px 42px 35px 35px/44px 29px 49px 31px; transform: rotate(7deg);}
.collage-shape-4  { left: 75vw;  top: 22px;  width: 190px; height: 160px; border-radius: 45px 22px 42px 32px; transform: rotate(-4deg);}
.collage-shape-5  { left: 7vw;   top: 290px; width: 222px; height: 146px; border-radius: 55px 33px 29px 60px/44px 29px 36px 61px; transform: rotate(6deg);}
.collage-shape-6  { left: 23vw;  top: 220px; width: 196px; height: 196px; border-radius: 50%; transform: rotate(-4deg);}
.collage-shape-7  { left: 43vw;  top: 240px; width: 215px; height: 130px; border-radius: 35px 44px 42px 30px; transform: rotate(-9deg);}
.collage-shape-8  { left: 65vw;  top: 215px; width: 188px; height: 164px; border-radius: 48px 22px 40px 35px; transform: rotate(9deg);}
.collage-shape-9  { left: 15vw;  top: 420px; width: 170px; height: 190px; border-radius: 48px 36px 33px 50px/33px 44px 42px 37px; transform: rotate(-7deg);}
.collage-shape-10 { left: 54vw;  top: 430px; width: 260px; height: 120px; border-radius: 60px 25px 55px 33px/35px 52px 32px 41px; transform: rotate(8deg);}

/* Fondo difuminado arriba y abajo */
.collage-gradient-top {
  width: 100vw;
  height: 72px;
  background: linear-gradient(to bottom, #fff 0%, #f6deca 96%);
  position: relative;
  z-index: 3;
}
.collage-gradient-bottom {
  width: 100vw;
  height: 100px;
  background: linear-gradient(to top, #2d144e 0%, #f6deca 95%);
  position: relative;
  z-index: 3;
  margin-top: -50px;
}

/* Responsive: grid en móvil, formas cuadradas */
@media (max-width: 900px) {
  .collage-moodboard-v4 {
    min-height: unset;
    padding-bottom: 40px;
    padding-top: 20px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px 8px;
    position: static;
  }
  .collage-moodboard-v4 .collage-img {
    position: static !important;
    width: 98vw !important;
    height: auto !important;
    max-width: 440px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    aspect-ratio: 16/10;
    margin: 0 auto;
    border-radius: 17px !important;
    box-shadow: 0 4px 16px #0001;
    border: 3px solid #fff7;
    transform: none !important;
  }
  .collage-gradient-top,
  .collage-gradient-bottom {
    height: 40px;
  }
}
@media (max-width: 600px) {
  .collage-moodboard-v4 {
    grid-template-columns: 1fr;
    gap: 14px 0;
    padding-bottom: 22vw;
  }
}
.collage-camel-bg {
  width: 100vw;
  background: #f6deca;
  position: relative;
  min-height: 720px;
  display: flex;
  justify-content: center;
  overflow: hidden;
}

.collage-moodboard-v5 {
  position: relative;
  width: 88vw;
  max-width: 1550px;
  min-height: 620px;
  margin: 0 auto;
  height: 620px;
}

/* --------- Polaroid/Blob/Estética ----------- */
.collage-img {
  position: absolute;
  object-fit: cover;
  border-radius: 22px;
  box-shadow: 0 10px 48px #0002, 0 2px 18px #4b38411a;
  border: 4px solid #fff7;
  transition: transform .35s cubic-bezier(.48,1.34,.62,1.07), box-shadow 0.19s, filter .17s;
  cursor: pointer;
  background: #fff;
}
.collage-img:hover {
  z-index: 10;
  transform: scale(1.14) rotate(-2deg);
  filter: brightness(1.07) saturate(1.14) drop-shadow(0 0 32px #e4b884aa);
  box-shadow: 0 22px 66px #cd985663, 0 4px 38px #643f8b18;
}

/* -- Cada shape es distinta, ¡ajusta aquí! -- */
/* Arriba */
.shape-1  { left:3vw;  top:30px;  width:270px; height:180px; border-radius: 36px 28px 38px 44px / 33px 32px 28px 40px; transform:rotate(-8deg);}
.shape-2  { left:23vw; top:0px;   width:180px; height:180px; border-radius:50%; box-shadow: 0 5px 25px #ad7e4231;}
.shape-3  { left:41vw; top:20px;  width:200px; height:150px; border-radius:22px 34px 32px 26px / 35px 25px 38px 22px; transform:rotate(7deg);}
.shape-4  { left:64vw; top:32px;  width:230px; height:170px; border-radius:28px 42px 38px 29px; transform:rotate(-3deg);}
.shape-5  { left:80vw; top:55px;  width:158px; height:155px; border-radius:44% 36% 48% 36% / 44% 44% 55% 55%; transform:rotate(9deg);}

/* Centro */
.shape-6  { left:8vw;  top:270px; width:156px; height:135px; border-radius: 25% 34% 29% 40% / 28% 33% 38% 22%;  transform:rotate(-4deg);}
.shape-7  { left:27vw; top:220px; width:144px; height:192px; border-radius:34% 55% 28% 44% / 50% 34% 40% 36%;  transform:rotate(4deg);}
.shape-8  { left:44vw; top:190px; width:210px; height:115px; border-radius: 38px 22px 44px 34px; box-shadow:0 4px 12px #836e5047; transform:rotate(-11deg);}
.shape-9  { left:62vw; top:220px; width:180px; height:120px; border-radius:25px 37px 42px 18px / 22px 35px 39px 26px; transform:rotate(8deg);}
.shape-10 { left:78vw; top:250px; width:170px; height:130px; border-radius:44% 36% 48% 36% / 44% 44% 55% 55%; transform:rotate(-7deg);}

.collage-camel-bg {
  background: #f6dfca;
  width: 100vw;
  padding: 0;
  margin: 0 auto;
  overflow-x: hidden;
}

.collage-moodboard-v5 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  grid-auto-rows: 180px;
  gap: 38px 40px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 42px 18px 56px 18px;
  position: relative;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
}

.collage-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 26px;
  background: #fff;
  box-shadow: 0 8px 36px #0002, 0 2px 10px #fff4;
  border: 2.5px solid #fff;
  transition: transform 0.28s, box-shadow 0.22s;
  cursor: pointer;
  display: block;
}

/* Tamaños distintos (opcional) */
.collage-img.tall { grid-row: span 2; }
.collage-img.wide { grid-column: span 2; }
.collage-img.square { aspect-ratio: 1/1; }

.collage-img:hover {
  transform: scale(1.08) rotate(-2deg);
  z-index: 2;
}

/* Responsive móvil */
@media (max-width: 900px) {
  .collage-moodboard-v5 {
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: 100px;
    gap: 16px 8px;
    padding: 18px 4vw 24px 4vw;
    max-width: 99vw;
  }
  .collage-img {
    border-radius: 13px;
  }
}
@media (max-width: 650px) {
  .collage-moodboard-v5 {
    grid-template-columns: 1fr;
    grid-auto-rows: 110px;
  }
}
.collage-camel-bg {
  background: #f6dfca;
  width: 100vw;
  padding: 0;
  margin: 0 auto;
  overflow-x: hidden;
}

.collage-moodboard-v5 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, auto));
  justify-content: center;
  gap: 34px 38px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 16px 60px 16px;
}

.collage-moodboard-v5 img {
  max-width: 100%;
  max-height: 210px;
  height: auto;
  width: auto;
  border-radius: 26px;
  background: #fff;
  box-shadow: 0 8px 36px #0002, 0 2px 10px #fff4;
  border: 2.5px solid #fff;
  transition: transform 0.25s, box-shadow 0.22s;
  cursor: pointer;
  object-fit: contain;
  display: block;
  margin: 0 auto;
}

.collage-moodboard-v5 img:hover {
  transform: scale(1.06) rotate(-2deg);
  z-index: 2;
}

/* Responsive móvil */
@media (max-width: 900px) {
  .collage-moodboard-v5 {
    grid-template-columns: repeat(2, 1fr);
    gap: 15px 8px;
    padding: 18px 4vw 22px 4vw;
    max-width: 99vw;
  }
  .collage-moodboard-v5 img {
    max-height: 130px;
    border-radius: 13px;
  }
}
@media (max-width: 700px) {
  .collage-moodboard-v5 {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    padding: 18px 0 12px 0;
    justify-items: center;
    align-items: center;
  }
  .collage-moodboard-v5 img,
  .collage-moodboard-v5 .collage-img {
    width: 94vw !important;
    max-width: 370px !important;
    min-width: 180px;
    height: auto !important;
    margin: 0 auto !important;
    border-radius: 18px !important;
    box-shadow: 0 4px 20px #0002;
    object-fit: cover !important;
    /* Quita transformaciones y rotaciones en móvil */
    transform: none !important;
    filter: none !important;
    z-index: 1 !important;
    position: static !important;
  }
}
@media (max-width: 600px) {
  .collage-moodboard-v5 {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 9px 3vw 8vw 3vw;
  }
  .collage-moodboard-v5 img {
    max-height: 99vw;
  }
}
.hide-mobile-menu-btn {
  display: none !important;
}
  .menu-btn-mobile.hide-on-modal {
    display: none !important;
  }
  /* El modal debe estar por encima de todo */
  .video-modal {
    z-index: 99999 !important;
  }
@media (max-width: 700px) {
  .collage-moodboard-v5 {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 18px 0 12px 0 !important;
    width: 100% !important;
  }
  .collage-moodboard-v5 img,
  .collage-moodboard-v5 .collage-img {
    width: 90vw !important;
    max-width: 390px !important;
    min-width: 120px !important;
    height: auto !important;
    margin: 0 auto !important;
    border-radius: 18px !important;
    box-shadow: 0 4px 20px #0002 !important;
    object-fit: cover !important;
    position: static !important;
    left: 0 !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 1 !important;
    transform: none !important;
    filter: none !important;
    opacity: 1 !important;
    background: none !important;
    /* Quita rotaciones y overlays raros */
  }
}
@media (max-width: 700px) {
  .collage-moodboard-v5 {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 18px 0 12px 0 !important;
    width: 100% !important;
    overflow-y: visible !important;
    overflow-x: hidden !important;
    max-height: none !important;
  }
  .collage-moodboard-v5 img,
  .collage-moodboard-v5 .collage-img {
    width: 90vw !important;
    max-width: 420px !important;
    height: auto !important;
    max-height: 65vw !important; /* Limita la altura en móvil */
    margin: 0 auto !important;
    border-radius: 18px !important;
    box-shadow: 0 4px 20px #0002 !important;
    object-fit: cover !important;
    position: static !important;
    transform: none !important;
  }
  /* Asegúrate de quitar cualquier overflow hidden del padre */
  .collage-camel-bg,
  .container-fluid,
  .container {
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
  }
}
body {
  margin: 0;
  font-family: 'Rajdhani', sans-serif;
  background: #fff;
  color: #2a0e4c;
}
.gallery-section {
  width: 100vw;
  min-height: 100vh;
  background: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.gallery-horizontal {
  width: 100vw;
  overflow-x: auto;
  overflow-y: visible;
  display: flex;
  gap: 40px;
  padding: 52px 0 26px 0;
  scroll-behavior: smooth;
  align-items: flex-end;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.gallery-horizontal::-webkit-scrollbar {
  display: none;
}
.gallery-img-container {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}
.gallery-img {
  width: 430px;
  max-width: 86vw;
  height: 340px;
  object-fit: cover;
  border-radius: 28px;
  box-shadow: 0 8px 40px #0004, 0 2px 8px #0002;
  transition: transform .28s cubic-bezier(.33,1.51,.57,.91), box-shadow .28s;
  cursor: pointer;
}
.gallery-img:hover {
  transform: scale(1.04) rotate(-2deg);
  box-shadow: 0 18px 60px #0005;
  z-index: 2;
}
.gallery-caption {
  margin-top: 10px;
  font-size: 1.13rem;
  color: #523184b3;
  letter-spacing: 0.4px;
  text-align: center;
}
.collab-text {
  margin: 0 auto;
  margin-top: 30px;
  max-width: 700px;
  background: rgba(42,14,76,0.04);
  border-radius: 18px;
  padding: 36px 34px 36px 34px;
  box-shadow: 0 4px 32px #0001;
}
.collab-text p {
  font-size: 2.1rem;
  font-family: 'Rajdhani', sans-serif;
  font-weight: 600;
  margin: 0;
  line-height: 1.2;
  color: #2a0e4c;
  letter-spacing: -0.4px;
  text-align: center;
  text-shadow: 0 2px 9px #fff8;
}
/* Modal para imagen ampliada */
.image-modal-bg {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.85);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}
.image-modal-bg img {
  max-width: 96vw;
  max-height: 95vh;
  border-radius: 20px;
  box-shadow: 0 0 38px #000c;
  background: #fff;
}
@media (max-width: 800px) {
  .gallery-img {
    width: 92vw;
    height: 46vw;
    max-width: 98vw;
    min-height: 180px;
    border-radius: 17px;
  }
  .collab-text {
    padding: 24px 4vw 24px 4vw;
    max-width: 97vw;
  }
  .collab-text p {
    font-size: 1.15rem;
  }
}
.galeria-scroll-wrapper {
  position: relative;
  max-width: 100vw;
  margin: 0 auto;
  /* Ajusta este margin si necesitas más espacio arriba/abajo */
}

.galeria-horizontal {
  overflow-x: auto;
  overflow-y: visible;
  white-space: nowrap;
  scroll-behavior: smooth;
  position: relative;
  padding: 0 60px; /* Deja espacio para las flechas */
}

.galeria-arrow-btn {
  position: absolute;
  top: 50%;
  z-index: 10;
  transform: translateY(-50%);
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  opacity: 0.12;
  transition: opacity 0.3s;
  pointer-events: none; /* Oculta a menos que la galería esté activa */
}

.galeria-scroll-wrapper:hover .galeria-arrow-btn,
.galeria-scroll-wrapper:focus-within .galeria-arrow-btn {
  opacity: 0.9;
  pointer-events: auto;
}

.galeria-arrow-btn img {
  width: 48px;
  height: 48px;
  user-select: none;
  pointer-events: none;
}

.galeria-arrow-btn.left {
  left: 0;
}

.galeria-arrow-btn.right {
  right: 0;
}

/* Mobile: flechas fijas arriba de las imágenes */
/* Pegado directo: flechas fijas en móvil */
@media (max-width: 768px) {
  .galeria-arrow-btn {
    position: fixed !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    opacity: 0.32;
    pointer-events: auto;
  }
  .galeria-arrow-btn.left {
    left: 10px !important;
    right: auto;
  }
  .galeria-arrow-btn.right {
    right: 10px !important;
    left: auto;
  }
  .galeria-scroll-wrapper {
    z-index: 2;
  }
}

/* Opcional: animación al presionar */
.galeria-arrow-btn:active img {
  filter: brightness(0.75);
}
.galeria-carousel {
  position: relative;
  /* Si tu contenedor de las imágenes tiene otro nombre, cambia aquí */
}

.galeria-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 4px 16px #0002;
  width: 50px;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0.94;
  transition: background 0.2s, opacity 0.2s;
  border: none;
  padding: 0;
  cursor: pointer;
}

.galeria-arrow img {
  width: 32px;
  height: 32px;
  user-select: none;
  pointer-events: none;
}

.galeria-arrow.galeria-left {
  left: 12px;
}

.galeria-arrow.galeria-right {
  right: 12px;
}

.collage-fullwidth {
  display: grid;
  grid-template-columns: repeat(5, 1fr); /* 5 columnas para desktop */
  grid-auto-rows: 260px; /* altura fija para filas */
  width: 100vw;
  max-width: 100vw;
  margin: 0;
  padding: 0;
  gap: 0; /* sin espacios entre imágenes */
  overflow: hidden;
  background: #fff; /* Fondo blanco */
}

.collage-fullwidth img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.collage-flex {
  display: flex;
  flex-wrap: wrap;
  width: 100vw;
  margin: 0;
  padding: 0;
  justify-content: center;
  align-items: flex-start;
  background: #fff;
}

.collage-flex img {
  /* Por default, las imágenes toman su tamaño real */
  margin: 0;
  padding: 0;
  object-fit: contain;
  display: block;
  /* Quita el espacio extra de abajo */
  vertical-align: bottom;
  /* Puedes poner un borde o sombra si quieres */
  /* box-shadow: 0 4px 16px #0001; */
}

/* Ejemplo: tú decides el tamaño de cada imagen */
.collage-flex img:nth-child(1) { width: 500px; }
.collage-flex img:nth-child(2) { width: 400px; }
.collage-flex img:nth-child(3) { width: 270px; }
.collage-flex img:nth-child(4) { width: 280px; }
.collage-flex img:nth-child(5) { width: 220px; }
.collage-flex img:nth-child(6) { width: 270px; }
.collage-flex img:nth-child(7) { width: 300px; }
.collage-flex img:nth-child(8) { width: 220px; }
.collage-flex img:nth-child(9) { width: 250px; }
.collage-flex img:nth-child(10) { width: 200px; }

/* Responsive para móvil */
@media (max-width: 900px) {
  .collage-flex img {
    width: 49vw !important;
    max-width: 100vw;
    height: auto;
  }
  .collage-flex {
    justify-content: flex-start;
  }
}

.collage-bg {
  width: 100vw;
  min-height: 380px;           /* Ajusta el alto como quieras */
  height: 42vw;                /* Responsive: 42% del ancho */
  background: url('img/collage.jpeg') no-repeat center center;
  background-size: cover;
  background-color: #fff;      /* Color de fondo mientras carga la imagen */
  box-shadow: 0 12px 38px #0001;
  margin: 0;
  padding: 0;
  border: none;
}

@media (max-width: 900px) {
  .collage-bg {
    min-height: 180px;
    height: 48vw;      /* Puedes ajustar para móvil */
    background-size: cover;
  }
}
.collage-static {
  width: 100%;
  overflow: hidden;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.collage-static img {
  width: 100%;
  height: auto;
  display: block;
  max-width: 1920px; /* opcional, ajusta según resolución máxima */
}
.highlight-text {
  padding: 60px 20px;
  text-align: center;
  background: #fff;
}

.gradient-bg {
  background: linear-gradient(to bottom, #ffffff 0%, #f9f9f9 100%);
}

.highlight-inner p {
  font-size: 1.3rem;
  max-width: 780px;
  margin: 0 auto;
  color: #2a0e4c;
  font-family: 'Rajdhani', sans-serif;
  font-weight: 600;
}

.tuchi-highlight-img {
  width: 340px;
  max-width: 100%;
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
}
/* Oculta el logo en pantallas pequeñas */
@media (max-width: 767px) {
  .desktop-logo {
    display: none !important;
  }
}

/* Evita que el logo se quede fijo */
.header .desktop-logo {
  position: static;
}
.hero-responsive {
  background-position: center top;
  background-size: cover;
  height: 100vh;
  position: relative;
}

/* Ajuste para celulares pequeños */
@media (max-width: 576px) {
  .hero-responsive {
    background-position: center 10%;
    background-size: contain;
    background-repeat: no-repeat;
    background-color: #000; /* Fondo de relleno si hay espacio */
  }

  .hero__text {
    position: absolute;
    bottom: 0; /* Estaba en 40px, ahora baja al borde */
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    color: white;
    width: 100%; /* opcional: asegura que el fondo morado se extienda */
    padding-bottom: 10px; /* opcional: espacio interno si el texto se pega demasiado */
  }
}

/* Ocultar versión móvil por defecto */
.hero-mobile-only {
  display: none;
}

/* Mostrar versión escritorio siempre */
.hero-desktop-only {
  display: block;
}

/* Imagen móvil visible solo en pantallas pequeñas */
@media (max-width: 576px) {
  .hero-mobile-only {
    display: block;
  }

  .hero-mobile-only img.img-mobile-version {
    width: 100%;
    height: auto;
    display: block;
  }

  .hero-desktop-only {
    display: none !important;
  }
}
/* Hero común */
.responsive-hero {
  background-image: url('../img/IMG_10652.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  height: 100vh;
  position: relative;
}

/* Hero para celular */
@media (max-width: 576px) {
  .responsive-hero {
    background-image: url('../img/IMG_10652mob.jpg'); /* Tu imagen vertical para móvil */
    background-position: top center;
  }
}