#fw-section-rich-text-178356006727191 {

h5, h6 {
  text-transform: none;
  font-size: 0.8rem;
}
}

#fw-section-custom-html-7926f9d8-7ce5-4f96-9af8-dcb7b648b063 {

/* TITLE BOX */

.box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1vw 3vw;
  color: #fff;
  /* text-align: center; */
  margin: auto;
  margin-top: 2rem;
  max-width: 70vw;
  position: relative;
  overflow: hidden;
}

.box h1 {
  margin-top: 0.5rem;
  text-align: center;
  font-size: 3rem;
  font-weight: 700;
}

.box p {
  margin-top: 2rem;
  margin-bottom: 1rem;
  font-size: 1.2rem;
  text-align: left
}
}
#fw-section-custom-html-6beee6f5-93fe-4c5b-8944-8d164752544d {

/* BOX EXPANSION ANIMATION */

.terms-box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1vw 3vw;
  color: #fff;
  /* text-align: center; */
  margin: auto;
  /* margin-top: 2rem; */
  max-width: 45vw;
  position: relative;
  overflow: hidden;
}

.box-expand {
  display: flex;
  justify-content: space-between;
  align-items: center;

  cursor: pointer;
}

.expand-arrow {
  rotate: -90deg;
  transition: transform 0.3s ease;
}

.terms-box.open .expand-arrow {
  transform: rotate(90deg);
}

.expand-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}

.terms-box.open .expand-body {
  max-height: 1000px;
}

/* TEXT STYLING */

.box-expand span {
  font-size: 1.3rem;
  font-weight: 700;
}

.expand-body h1 {
  font-size: 1rem;
  text-transform: none;
  margin-top: 15px;
}

.expand-body h2 {
  font-size: 1.5rem;
  margin-top: 30px;
  margin-bottom: 10px;
}

.expand-body p {
  line-height: 30px;
}

.expand-body h3 {
  font-size: 0.8rem;
  text-transform: none;
  text-align: center;

  margin-top: 10px;

  transition: all 0.2s ease;
}

.expand-body h3 :hover {
  color: rgba(113, 17, 181, 0.8);
}
}
#fw-section-rich-text-178586088685071 {

.rich-text__header {
  font-size: 2.7rem;
  font-weight: 800;
}

.html-formatter {
  font-size: 1.2rem;
}
}
#fw-section-custom-html-2dd64384-d172-476c-a2f9-9393e18a78f0 {

/* TRANSLUCENT BOXES */

.comms-box {
  background: rgba(56, 56, 56, 0.23);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);

  padding: 2vw 2vw;
  color: #fff;
  text-align: center;
  margin: auto;
  /*width: 80vw;*/
  max-width: 1600px;
  /* min-width: 280px; */
  height: auto;

  position: relative;
  overflow: hidden;

  margin-bottom: 1.5rem;
}

.comms-box:hover {
  max-height: 350px;
  background: rgba(56, 56, 56, 0.25);
}

.comms-box:hover .box1-content,
.comms-box:hover .box3-content {
  opacity: 1;
  max-height: 350px;
  /* padding-bottom: 2rem; */
  visibility: visible;
}

.comms-box:hover .box5-content,
.comms-box:focus-within .box5-content {
  max-height: 320px;
  opacity: 1;
  visibility: visible;
  padding-top: 1.5rem;
}

.comms-box:hover .box5-content textarea,
.comms-box:focus-within .box5-content textarea {
  pointer-events: auto;
  transform: translateY(0);
}

/* TITLE TEXT */

.comms-title {
  font-size: clamp(1rem, 2vw, 2rem);
  margin-bottom: 0.5rem;
  transition: color 0.3s ease;
}

/* BUTTON STYLE */

/* Highlight Box 1 buttons when their radio is checked */
#service-full:checked ~ .box-1 label[for="service-full"] span,
#service-mixing:checked ~ .box-1 label[for="service-mixing"] span,
#service-vocals:checked ~ .box-1 label[for="service-vocals"] span {
  background: rgba(69, 187, 202, 0.856);
  border-color: rgba(255, 255, 255, 0.6);
  transform: scale(1.05);
}


input[type="radio"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.select-btn span {
  display: inline-block;
  background: rgba(126, 46, 119, 0.377);
  border: 1px solid rgba(255, 255, 255, 0.397);
  border-radius: 20px;
  color: white;
  font-size: clamp(0.9rem, 1.2vw, 1.2rem);
  padding: clamp(0.5rem, 0.8vw, 0.8rem) clamp(1rem, 0.8vw, 1.5rem);
  cursor: pointer;
  transition: all 0.3s ease;
  min-width: clamp(100px, 15vw, 200px);

  margin: 0.6rem;
}

.select-btn span:hover {
  background: rgba(55, 146, 158, 0.548);
}

input[type="radio"]:checked + span {
  background: rgba(69, 187, 202, 0.856);
  border-color: rgba(255, 255, 255, 0.6);
  transform: scale(1.05);
}

.comms-box:hover .box5-content {
  opacity: 1;
  visibility: visible;
}

.toggle {
  display: none;
}

.select-toggle {
  display: inline-block;
  background: rgba(126, 46, 119, 0.377);
  border: 1px solid rgba(255, 255, 255, 0.397);
  border-radius: 12px;
  color: white;
  font-size: clamp(0.9rem, 1.2vw, 1.2rem);
  padding: clamp(0.5rem, 1vw, 0.8rem) clamp(1rem, 2vw, 2rem);
  cursor: pointer;
  transition: all 0.2s ease;
  min-width: clamp(100px, 20vw, 200px);
  /* opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease, visibility 0.2s ease; */
}

.select-toggle:hover {
  background: rgba(69, 187, 202, 0.856);
}

.box5-text {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: all 0.2s ease;
  margin-top: 10px;
}

.toggle:checked + .select-toggle + .box5-text {
  max-height: 200px;
  opacity: 1;
}

.send-btn {
  display: flex;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

.send-btn button {
  display: inline-block;
  background: rgba(49, 130, 141, 0.603);
  border: 1px solid rgba(255, 255, 255, 0.397);
  border-radius: clamp(12px, 25px, 50px);
  color: white;
  font-size: clamp(1.2rem, 2.4vw, 2.4rem);
  font-weight: bold;
  padding: clamp(0.4rem, 1vw, 0.6rem) clamp(0.3rem, 0.2vw, 1.2rem);
  cursor: pointer;
  transition: all 0.3s ease;
  min-width: clamp(100px, 20vw, 200px);
  margin-bottom: 2rem;
}

.send-btn button:hover {
  background: rgba(69, 187, 202, 0.856);
}

.confirm-send:has(#confirm-submit:checked) ~ .send-btn {
  opacity: 1;
  /*margin-left: 39.3vw;*/
  pointer-events: auto;
}

.confirm-send {
  display: flex;
  justify-content: center;
  margin: 1.5rem auto;
  /*width: 80vw;*/
  max-width: 1600px;
  color: #fff;
  font-size: 1.2rem;
  pointer-events: auto;
}

.confirm-send input {
  margin-right: 0.5rem;
}

.confirm-send a:hover {
  color: rgb(197, 50, 160);
}


/* TEXT EDITOR STYLE */

.box2-content textarea,
.box4-content textarea{

  width: 80%;
  min-height: 100px;
  max-width: 800px;
  padding: 0.8rem;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.1);
  color: white;
  font-size: 1rem;
  resize: vertical;
  outline: none;
  backdrop-filter: blur(10px);
  transition: all 0.3s ease;

  resize: vertical;
  outline: none;

  pointer-events: auto;
  transform-origin: top center;
  transition: transform 0.35s cubic-bezier(.2,.9,.2,1);
}

.box2-content textarea:focus,
.box4-content textarea:focus {
  background: rgba(255, 255, 255, 0.2);
  border-color: rgba(255, 255, 255, 0.6);
}

.box5-content textarea{
  width: 80%;
  min-height: 100px;
  max-width: 800px;
  padding: 0.8rem;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.1);
  color: white;
  font-size: 1rem;
  resize: vertical;
  outline: none;
  backdrop-filter: blur(10px);
  transition: all 0.3s ease;
  margin-bottom: 1rem;

  resize: vertical;
  outline: none;

  pointer-events: none;
  transform-origin: top center;
  transition: transform 0.35s cubic-bezier(.2,.9,.2,1);
}

.box5-content textarea:focus {
  background: rgba(255, 255, 255, 0.2);
  border-color: rgba(255, 255, 255, 0.6);
}

/* BOX 3 SELECTOR */

.fullsong-extras,
.vocals-extras {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-height 0.35s ease, opacity 0.25s ease;
}

/* Full song selected */
#service-full:checked ~ .box-3 .fullsong-extras {
  max-height: 500px;
  opacity: 1;
}

/* Vocals selected */
#service-vocals:checked ~ .box-3 .vocals-extras {
  max-height: 300px;
  opacity: 1;
}

}
#fw-section-custom-html-b7f9b4f0-fe25-457b-ba08-d4b3f6a9fd8e {

.form {
  display: flex;
  justify-content: center;
}
}

#fw-section-custom-html-07e3c553-2c4f-49f2-bad6-fc4a53208ab1 {

/* TITLE BOX */

.box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1vw 3vw;
  color: #fff;
  /* text-align: center; */
  margin: auto;
  margin-top: 2rem;
  max-width: 70vw;
  position: relative;
  overflow: hidden;
}

.box h1 {
  margin-top: 0.5rem;
  text-align: center;
  font-size: 3rem;
  font-weight: 700;
}

.box p {
  margin-top: 2rem;
  margin-bottom: 1rem;
  font-size: 1.2rem;
  text-align: left
}
}
#fw-section-custom-html-828e43c0-6ea1-42d5-99ff-2644756a3500 {

/* BOX EXPANSION ANIMATION */

.terms-box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1vw 3vw;
  color: #fff;
  /* text-align: center; */
  margin: auto;
  /* margin-top: 2rem; */
  max-width: 45vw;
  position: relative;
  overflow: hidden;
}

.box-expand {
  display: flex;
  justify-content: space-between;
  align-items: center;

  cursor: pointer;
}

.expand-arrow {
  rotate: -90deg;
  transition: transform 0.3s ease;
}

.terms-box.open .expand-arrow {
  transform: rotate(90deg);
}

.expand-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}

.terms-box.open .expand-body {
  max-height: 1000px;
}

/* TEXT STYLING */

.box-expand span {
  font-size: 1.3rem;
  font-weight: 700;
}

.expand-body h1 {
  font-size: 1rem;
  text-transform: none;
  margin-top: 15px;
}

.expand-body h2 {
  font-size: 1.5rem;
  margin-top: 30px;
  margin-bottom: 10px;
}

.expand-body p {
  line-height: 30px;
}

.expand-body h3 {
  font-size: 0.8rem;
  text-transform: none;
  text-align: center;

  margin-top: 10px;

  transition: all 0.2s ease;
}

.expand-body h3 :hover {
  color: rgba(113, 17, 181, 0.8);
}
}
#fw-section-custom-html-c3dc88fe-5caa-4c1c-acda-803d726a94a8 {

/* BOX STYLE */

.music-box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1vw 3vw;
  color: #fff;
  margin: auto;
  margin-top: 2rem;
  max-width: 70vw;
}

.box-main {
  display: flex;
  align-items: center;
  gap: 2rem;
}

.music-right {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  flex: 1;
}

.preview-image {
  text-align: center;
}

.song-link {
  text-align: center;
}

/* PREVIEW THUMBNAIL/COVER ART */

.preview-image img {
  height: 200px;
  width: 200px;
  border-radius: 13px;
  margin-bottom: 10px;
}

/* TEXT STYLE */

.preview-image h3 {
  text-transform: none;
}

.music-text p, a {
  margin: 0;
  font-size: 1.1rem;
  color: rgba(255, 255, 255, 0.7);
}

.song-link a {
  font-size: 0.8rem;
}

.song-link a:hover {
  color: rgba(113, 17, 181, 0.8);
}
}
#fw-section-custom-html-830de23f-f7ce-48d7-a5ab-9b8e4f5a6aea {

/* BOX STYLE */

.music-box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1vw 3vw;
  color: #fff;
  margin: auto;
  margin-top: 2rem;
  max-width: 70vw;
}

.box-main {
  display: flex;
  align-items: center;
  gap: 2rem;
}

.music-right {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  flex: 1;
}

.preview-image {
  text-align: center;
}

.song-link {
  text-align: center;
}

/* PREVIEW THUMBNAIL/COVER ART */

.preview-image img {
  height: 200px;
  width: 200px;
  border-radius: 13px;
  margin-bottom: 10px;
}

/* TEXT STYLE */

.preview-image h3 {
  text-transform: none;
}

.music-text p, a {
  margin: 0;
  font-size: 1.1rem;
  color: rgba(255, 255, 255, 0.7);
}

.song-link a {
  font-size: 0.8rem;
}

.song-link a:hover {
  color: rgba(113, 17, 181, 0.8);
}
}
#fw-section-custom-html-6fafa607-0603-40a1-b80a-1877ae98a7cb {

/* BOX STYLE */

.music-box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1vw 3vw;
  color: #fff;
  margin: auto;
  margin-top: 2rem;
  max-width: 70vw;
}

.box-main {
  display: flex;
  align-items: center;
  gap: 2rem;
}

.music-right {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  flex: 1;
}

.preview-image {
  text-align: center;
}

.song-link {
  text-align: center;
}

/* PREVIEW THUMBNAIL/COVER ART */

.preview-image img {
  height: 200px;
  width: 200px;
  border-radius: 13px;
  margin-bottom: 10px;
}

/* TEXT STYLE */

.preview-image h3 {
  text-transform: none;
}

.music-text p, a {
  margin: 0;
  font-size: 1.1rem;
  color: rgba(255, 255, 255, 0.7);
}

.song-link a {
  font-size: 0.8rem;
}

.song-link a:hover {
  color: rgba(113, 17, 181, 0.8);
}
}
#fw-section-custom-html-f15772df-d3aa-4681-97fa-b9e1c6772d26 {

/* BOX STYLE */

.music-box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1vw 3vw;
  color: #fff;
  margin: auto;
  margin-top: 2rem;
  max-width: 70vw;
}

.box-main {
  display: flex;
  align-items: center;
  gap: 2rem;
}

.music-right {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  flex: 1;
}

.preview-image {
  text-align: center;
}

.song-link {
  text-align: center;
}

/* PREVIEW THUMBNAIL/COVER ART */

.preview-image img {
  height: 200px;
  width: 200px;
  border-radius: 13px;
  margin-bottom: 10px;
}

/* TEXT STYLE */

.preview-image h3 {
  text-transform: none;
}

.music-text p, a {
  margin: 0;
  font-size: 1.1rem;
  color: rgba(255, 255, 255, 0.7);
}

.song-link a {
  font-size: 0.8rem;
}

.song-link a:hover {
  color: rgba(113, 17, 181, 0.8);
}
}
#fw-section-custom-html-89e5ed78-86a3-46a3-844c-388cbfc808f8 {

/* BOX STYLE */

.music-box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1vw 3vw;
  color: #fff;
  margin: auto;
  margin-top: 2rem;
  max-width: 70vw;
}

.box-main {
  display: flex;
  align-items: center;
  gap: 2rem;
}

.music-right {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  flex: 1;
}

.preview-image {
  text-align: center;
}

.song-link {
  text-align: center;
}

/* PREVIEW THUMBNAIL/COVER ART */

.preview-image img {
  height: 200px;
  width: 200px;
  border-radius: 13px;
  margin-bottom: 10px;
}

/* TEXT STYLE */

.preview-image h3 {
  text-transform: none;
}

.music-text p, a {
  margin: 0;
  font-size: 1.1rem;
  color: rgba(255, 255, 255, 0.7);
}

.song-link a {
  font-size: 0.8rem;
}

.song-link a:hover {
  color: rgba(113, 17, 181, 0.8);
}
}
#fw-section-custom-html-4111a63c-c97b-460a-8d1b-17f2a9ff7231 {

/* BOX STYLE */

.music-box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1vw 3vw;
  color: #fff;
  margin: auto;
  margin-top: 2rem;
  max-width: 70vw;
}

.box-main {
  display: flex;
  align-items: center;
  gap: 3rem;
}

.music-right {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  flex: 1;
}

.preview-image {
  text-align: center;
}

.song-link {
  text-align: center;
}

/* PREVIEW THUMBNAIL/COVER ART */

.preview-image img {
  height: 150px;
  width: auto;
  border-radius: 13px;
  margin-bottom: 10px;
}

/* TEXT STYLE */

.preview-image h3 {
  text-transform: none;
}

.music-text p, a {
  margin: 0;
  font-size: 1.1rem;
  color: rgba(255, 255, 255, 0.7);
}

.song-link a {
  font-size: 0.8rem;
}

.song-link a:hover {
  color: rgba(113, 17, 181, 0.8);
}
}
#fw-section-custom-html-63235416-d078-4919-9430-0bbf76c8a7f9 {

/* BOX STYLE */

.music-box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1vw 3vw;
  color: #fff;
  margin: auto;
  margin-top: 2rem;
  max-width: 70vw;
}

.box-main {
  display: flex;
  align-items: center;
  gap: 3rem;
}

.music-right {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  flex: 1;
}

.preview-image {
  text-align: center;
}

.song-link {
  text-align: center;
}

/* PREVIEW THUMBNAIL/COVER ART */

.preview-image img {
  height: 200px;
  width: auto;
  border-radius: 13px;
  margin-bottom: 10px;
}

/* TEXT STYLE */

.preview-image h3 {
  text-transform: none;
}

.music-text p, a {
  margin: 0;
  font-size: 1.1rem;
  color: rgba(255, 255, 255, 0.7);
}

.song-link a {
  font-size: 0.8rem;
}

.song-link a:hover {
  color: rgba(113, 17, 181, 0.8);
}
}
#fw-section-custom-html-796b6002-2e6f-4fc2-a657-dac3137b66a0 {

/* BOX STYLE */

.music-box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1vw 3vw;
  color: #fff;
  margin: auto;
  margin-top: 2rem;
  max-width: 70vw;
}

.box-main {
  display: flex;
  align-items: center;
  gap: 3rem;
}

.music-right {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  flex: 1;
}

.preview-image {
  text-align: center;
}

.song-link {
  text-align: center;
}

/* PREVIEW THUMBNAIL/COVER ART */

.preview-image img {
  height: 150px;
  width: auto;
  border-radius: 13px;
  margin-bottom: 10px;
}

/* TEXT STYLE */

.preview-image h3 {
  text-transform: none;
}

.music-text p, a {
  margin: 0;
  font-size: 1.1rem;
  color: rgba(255, 255, 255, 0.7);
}

.song-link a {
  font-size: 0.8rem;
}

.song-link a:hover {
  color: rgba(113, 17, 181, 0.8);
}
}
#fw-section-custom-html-7e3caff8-36b5-4d20-9720-e45af22cbd26 {

/* BOX STYLE */

.music-box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1vw 3vw;
  color: #fff;
  margin: auto;
  margin-top: 2rem;
  max-width: 70vw;
}

.box-main {
  display: flex;
  align-items: center;
  gap: 3rem;
}

.music-right {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  flex: 1;
}

.preview-image {
  text-align: center;
}

.song-link {
  text-align: center;
}

/* PREVIEW THUMBNAIL/COVER ART */

.preview-image img {
  height: 200px;
  width: auto;
  border-radius: 13px;
  margin-bottom: 10px;
}

/* TEXT STYLE */

.preview-image h3 {
  text-transform: none;
}

.music-text p, a {
  margin: 0;
  font-size: 1.1rem;
  color: rgba(255, 255, 255, 0.7);
}

.song-link a {
  font-size: 0.8rem;
}

.song-link a:hover {
  color: rgba(113, 17, 181, 0.8);
}
}
#fw-section-custom-html-01591ba4-1bff-4dab-b44c-42a68077b9e2 {

/* BOX STYLE */

.music-box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1vw 3vw;
  color: #fff;
  margin: auto;
  margin-top: 2rem;
  max-width: 70vw;
}

.box-main {
  display: flex;
  align-items: center;
  gap: 3rem;
}

.music-right {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  flex: 1;
}

.preview-image {
  text-align: center;
}

.song-link {
  text-align: center;
}

/* PREVIEW THUMBNAIL/COVER ART */

.preview-image img {
  height: 200px;
  width: auto;
  border-radius: 13px;
  margin-bottom: 10px;
}

/* TEXT STYLE */

.preview-image h3 {
  text-transform: none;
}

.music-text p, a {
  margin: 0;
  font-size: 1.1rem;
  color: rgba(255, 255, 255, 0.7);
}

.song-link a {
  font-size: 0.8rem;
}

.song-link a:hover {
  color: rgba(113, 17, 181, 0.8);
}
}
#fw-section-custom-html-e63380d3-6dba-4cf7-a6f4-e75df7820ed2 {

/* BOX STYLE */

.music-box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1vw 3vw;
  color: #fff;
  margin: auto;
  margin-top: 2rem;
  max-width: 70vw;
}

.box-main {
  display: flex;
  align-items: center;
  gap: 3rem;
}

.music-right {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  flex: 1;
}

.preview-image {
  text-align: center;
}

.song-link {
  text-align: center;
}

/* PREVIEW THUMBNAIL/COVER ART */

.preview-image img {
  height: 200px;
  width: auto;
  border-radius: 13px;
  margin-bottom: 10px;
}

/* TEXT STYLE */

.preview-image h3 {
  text-transform: none;
  text-align: center;
  font-size: 1.2rem;
}

.music-text p, a {
  margin: 0;
  font-size: 1.1rem;
  color: rgba(255, 255, 255, 0.7);
}

.song-link a {
  font-size: 0.8rem;
}

.song-link a:hover {
  color: rgba(113, 17, 181, 0.8);
}
}
#fw-section-rich-text-176593066684288 {

.rich-text__header {
  font-size: 2.7rem;
  font-weight: 800;
}

.html-formatter {
  font-size: 1.2rem;
}
}
#fw-section-custom-html-ee3491d1-d47f-44ca-b4be-78209def426f {

/* TRANSLUCENT BOXES */

.comms-box {
  background: rgba(56, 56, 56, 0.23);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);

  padding: 2vw 2vw;
  color: #fff;
  text-align: center;
  margin: auto;
  /*width: 80vw;*/
  max-width: 1600px;
  /* min-width: 280px; */
  height: auto;

  position: relative;
  overflow: hidden;

  margin-bottom: 1.5rem;
}

.comms-box:hover {
  max-height: 350px;
  background: rgba(56, 56, 56, 0.25);
}

.comms-box:hover .box1-content,
.comms-box:hover .box3-content {
  opacity: 1;
  max-height: 350px;
  /* padding-bottom: 2rem; */
  visibility: visible;
}

.comms-box:hover .box5-content,
.comms-box:focus-within .box5-content {
  max-height: 320px;
  opacity: 1;
  visibility: visible;
  padding-top: 1.5rem;
}

.comms-box:hover .box5-content textarea,
.comms-box:focus-within .box5-content textarea {
  pointer-events: auto;
  transform: translateY(0);
}

/* TITLE TEXT */

.comms-title {
  font-size: clamp(1rem, 2vw, 2rem);
  margin-bottom: 0.5rem;
  transition: color 0.3s ease;
}

/* BUTTON STYLE */

/* Highlight Box 1 buttons when their radio is checked */
#service-full:checked ~ .box-1 label[for="service-full"] span,
#service-mixing:checked ~ .box-1 label[for="service-mixing"] span,
#service-vocals:checked ~ .box-1 label[for="service-vocals"] span {
  background: rgba(69, 187, 202, 0.856);
  border-color: rgba(255, 255, 255, 0.6);
  transform: scale(1.05);
}


input[type="radio"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.select-btn span {
  display: inline-block;
  background: rgba(126, 46, 119, 0.377);
  border: 1px solid rgba(255, 255, 255, 0.397);
  border-radius: 20px;
  color: white;
  font-size: clamp(0.9rem, 1.2vw, 1.2rem);
  padding: clamp(0.5rem, 0.8vw, 0.8rem) clamp(1rem, 0.8vw, 1.5rem);
  cursor: pointer;
  transition: all 0.3s ease;
  min-width: clamp(100px, 15vw, 200px);

  margin: 0.6rem;
}

.select-btn span:hover {
  background: rgba(55, 146, 158, 0.548);
}

input[type="radio"]:checked + span {
  background: rgba(69, 187, 202, 0.856);
  border-color: rgba(255, 255, 255, 0.6);
  transform: scale(1.05);
}

.comms-box:hover .box5-content {
  opacity: 1;
  visibility: visible;
}

.toggle {
  display: none;
}

.select-toggle {
  display: inline-block;
  background: rgba(126, 46, 119, 0.377);
  border: 1px solid rgba(255, 255, 255, 0.397);
  border-radius: 12px;
  color: white;
  font-size: clamp(0.9rem, 1.2vw, 1.2rem);
  padding: clamp(0.5rem, 1vw, 0.8rem) clamp(1rem, 2vw, 2rem);
  cursor: pointer;
  transition: all 0.2s ease;
  min-width: clamp(100px, 20vw, 200px);
  /* opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease, visibility 0.2s ease; */
}

.select-toggle:hover {
  background: rgba(69, 187, 202, 0.856);
}

.box5-text {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: all 0.2s ease;
  margin-top: 10px;
}

.toggle:checked + .select-toggle + .box5-text {
  max-height: 200px;
  opacity: 1;
}

.send-btn {
  display: flex;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

.send-btn button {
  display: inline-block;
  background: rgba(49, 130, 141, 0.603);
  border: 1px solid rgba(255, 255, 255, 0.397);
  border-radius: clamp(12px, 25px, 50px);
  color: white;
  font-size: clamp(1.2rem, 2.4vw, 2.4rem);
  font-weight: bold;
  padding: clamp(0.4rem, 1vw, 0.6rem) clamp(0.3rem, 0.2vw, 1.2rem);
  cursor: pointer;
  transition: all 0.3s ease;
  min-width: clamp(100px, 20vw, 200px);
  margin-bottom: 2rem;
}

.send-btn button:hover {
  background: rgba(69, 187, 202, 0.856);
}

.confirm-send:has(#confirm-submit:checked) ~ .send-btn {
  opacity: 1;
  /*margin-left: 39.3vw;*/
  pointer-events: auto;
}

.confirm-send {
  display: flex;
  justify-content: center;
  margin: 1.5rem auto;
  /*width: 80vw;*/
  max-width: 1600px;
  color: #fff;
  font-size: 1.2rem;
  pointer-events: auto;
}

.confirm-send input {
  margin-right: 0.5rem;
}

.confirm-send a:hover {
  color: rgb(197, 50, 160);
}


/* TEXT EDITOR STYLE */

.box2-content textarea,
.box4-content textarea{

  width: 80%;
  min-height: 100px;
  max-width: 800px;
  padding: 0.8rem;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.1);
  color: white;
  font-size: 1rem;
  resize: vertical;
  outline: none;
  backdrop-filter: blur(10px);
  transition: all 0.3s ease;

  resize: vertical;
  outline: none;

  pointer-events: auto;
  transform-origin: top center;
  transition: transform 0.35s cubic-bezier(.2,.9,.2,1);
}

.box2-content textarea:focus,
.box4-content textarea:focus {
  background: rgba(255, 255, 255, 0.2);
  border-color: rgba(255, 255, 255, 0.6);
}

.box5-content textarea{
  width: 80%;
  min-height: 100px;
  max-width: 800px;
  padding: 0.8rem;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.1);
  color: white;
  font-size: 1rem;
  resize: vertical;
  outline: none;
  backdrop-filter: blur(10px);
  transition: all 0.3s ease;
  margin-bottom: 1rem;

  resize: vertical;
  outline: none;

  pointer-events: none;
  transform-origin: top center;
  transition: transform 0.35s cubic-bezier(.2,.9,.2,1);
}

.box5-content textarea:focus {
  background: rgba(255, 255, 255, 0.2);
  border-color: rgba(255, 255, 255, 0.6);
}

/* BOX 3 SELECTOR */

.fullsong-extras,
.vocals-extras {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-height 0.35s ease, opacity 0.25s ease;
}

/* Full song selected */
#service-full:checked ~ .box-3 .fullsong-extras {
  max-height: 500px;
  opacity: 1;
}

/* Vocals selected */
#service-vocals:checked ~ .box-3 .vocals-extras {
  max-height: 300px;
  opacity: 1;
}

}
#fw-section-custom-html-02479c63-f75e-4d15-84ff-606a269adeb3 {

.services {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 3rem;
  max-width: 1000px;
  margin: auto;
  justify-items: center;
}

.services h1 {
  font-size: 1.5rem;
  text-align: center;

  /* padding-top: 4.5rem; */
  padding-bottom: 1rem;

  transition: transform 0.3s ease, color 0.3s ease;
}

.services h1 a {
  text-decoration: none;
  color: inherit;
}

.services h1:hover {
  color: rgba(139, 19, 170, 0.86);
  transform: scale(1.05);
  cursor: pointer;
}

.service-box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1rem 1rem;
  color: #fff;
  max-width: 13rem;
}

.service-box img:hover {
  cursor: pointer;
  transform: scale(1.05);
}

.service-box img {
  max-height: 13rem;
  max-width: auto;
  border-radius: 13px;
  transition: transform 0.3s ease;
}

.music h1 {
  text-align: center;
}


}


#fw-section-custom-html-4b027565-367e-4cd4-9600-3d6d39abaf78 {

/* TITLE BOX */

.box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1vw 3vw;
  color: #fff;
  /* text-align: center; */
  margin: auto;
  margin-top: 2rem;
  max-width: 70vw;
  position: relative;
  overflow: hidden;
}

.box h1 {
  margin-top: 0.5rem;
  text-align: center;
  font-size: 3rem;
  font-weight: 700;
}

.box p {
  margin-top: 2rem;
  margin-bottom: 1rem;
  font-size: 1.2rem;
  text-align: left
}
}
#fw-section-custom-html-d8893253-937b-4769-9808-8c56993d072a {

/* BOX EXPANSION ANIMATION */

.terms-box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1vw 3vw;
  color: #fff;
  /* text-align: center; */
  margin: auto;
  /* margin-top: 2rem; */
  max-width: 45vw;
  position: relative;
  overflow: hidden;
}

.box-expand {
  display: flex;
  justify-content: space-between;
  align-items: center;

  cursor: pointer;
}

.expand-arrow {
  rotate: -90deg;
  transition: transform 0.3s ease;
}

.terms-box.open .expand-arrow {
  transform: rotate(90deg);
}

.expand-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}

.terms-box.open .expand-body {
  max-height: 1000px;
}

/* TEXT STYLING */

.box-expand span {
  font-size: 1.3rem;
  font-weight: 700;
}

.expand-body h1 {
  font-size: 1rem;
  text-transform: none;
  margin-top: 15px;
}

.expand-body h2 {
  font-size: 1.5rem;
  margin-top: 30px;
  margin-bottom: 10px;
}

.expand-body p {
  line-height: 30px;
}

.expand-body h3 {
  font-size: 0.8rem;
  text-transform: none;
  text-align: center;

  margin-top: 10px;

  transition: all 0.2s ease;
}

.expand-body h3 :hover {
  color: rgba(113, 17, 181, 0.8);
}
}



#fw-section-tiers-e62ad1e6-97a4-40bf-a330-29687eebe4c2 {

.tiers__tier {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);

  /* Padding and layout */
  padding: 3rem 2rem;
  color: #fff;
  text-align: center;
  margin: auto;
  /*width: 80vw;*/
  max-width: 1600px;
  height: 70vh;

  position: relative;
  overflow: hidden;
}

.tiers__tier-description {
  font-size: clamp(0.6rem, 1rem, 1.5rem)
}

.button {
  display: inline-block;
  background: rgba(55, 146, 158, 0.55);
  border: 1px solid rgba(255, 255, 255, 0.397);
  border-radius: clamp(12px, 25px, 50px);
  color: white;
  font-size: clamp(0.9rem, 1.2vw, 1.2rem);
  padding: clamp(0.5rem, 1vw, 0.8rem) clamp(1rem, 2vw, 2rem);
  cursor: pointer;
  transition: all 0.3s ease;
  min-width: clamp(100px, 20vw, 200px);
}

.button:hover {
  background: rgba(171, 43, 172, 0.55);
}
}
#fw-section-donations-08519629-e674-4f4c-b56b-b393b4d1cae5 {

.input-field__input {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 15px;                    /* rounded corners */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);

  /* Padding and layout */
  color: #fff;
  margin: auto;
  /*width: 80vw;*/
  max-width: 1600px;
  

  position: relative;
  overflow: hidden;
}

.button {
  display: inline-block;
  background: rgba(55, 146, 158, 0.55);
  border: 1px solid rgba(255, 255, 255, 0.397);
  border-radius: clamp(12px, 25px, 50px);
  color: white;
  font-size: clamp(0.9rem, 1.2vw, 1.2rem);
  padding: clamp(0.5rem, 1vw, 0.8rem) clamp(1rem, 2vw, 2rem);
  cursor: pointer;
  transition: all 0.3s ease;
  min-width: clamp(100px, 20vw, 200px);
}

.button:hover {
  background: rgba(171, 43, 172, 0.55);
}

.radio-button__label {
  background: rgba(171, 43, 172, 0.55);
}
}
#fw-section-rich-text-178586085940564 {

.rich-text__header {
  font-size: 2.7rem;
  font-weight: 800;
}

.html-formatter {
  font-size: 1.2rem;
}
}
#fw-section-custom-html-1457df1f-3c3f-49ce-9bd1-ba68e794e84f {

/* TRANSLUCENT BOXES */

.comms-box {
  background: rgba(56, 56, 56, 0.23);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);

  padding: 2vw 2vw;
  color: #fff;
  text-align: center;
  margin: auto;
  /*width: 80vw;*/
  max-width: 1600px;
  /* min-width: 280px; */
  height: auto;

  position: relative;
  overflow: hidden;

  margin-bottom: 1.5rem;
}

.comms-box:hover {
  max-height: 350px;
  background: rgba(56, 56, 56, 0.25);
}

.comms-box:hover .box1-content,
.comms-box:hover .box3-content {
  opacity: 1;
  max-height: 350px;
  /* padding-bottom: 2rem; */
  visibility: visible;
}

.comms-box:hover .box5-content,
.comms-box:focus-within .box5-content {
  max-height: 320px;
  opacity: 1;
  visibility: visible;
  padding-top: 1.5rem;
}

.comms-box:hover .box5-content textarea,
.comms-box:focus-within .box5-content textarea {
  pointer-events: auto;
  transform: translateY(0);
}

/* TITLE TEXT */

.comms-title {
  font-size: clamp(1rem, 2vw, 2rem);
  margin-bottom: 0.5rem;
  transition: color 0.3s ease;
}

/* BUTTON STYLE */

/* Highlight Box 1 buttons when their radio is checked */
#service-full:checked ~ .box-1 label[for="service-full"] span,
#service-mixing:checked ~ .box-1 label[for="service-mixing"] span,
#service-vocals:checked ~ .box-1 label[for="service-vocals"] span {
  background: rgba(69, 187, 202, 0.856);
  border-color: rgba(255, 255, 255, 0.6);
  transform: scale(1.05);
}


input[type="radio"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.select-btn span {
  display: inline-block;
  background: rgba(126, 46, 119, 0.377);
  border: 1px solid rgba(255, 255, 255, 0.397);
  border-radius: 20px;
  color: white;
  font-size: clamp(0.9rem, 1.2vw, 1.2rem);
  padding: clamp(0.5rem, 0.8vw, 0.8rem) clamp(1rem, 0.8vw, 1.5rem);
  cursor: pointer;
  transition: all 0.3s ease;
  min-width: clamp(100px, 15vw, 200px);

  margin: 0.6rem;
}

.select-btn span:hover {
  background: rgba(55, 146, 158, 0.548);
}

input[type="radio"]:checked + span {
  background: rgba(69, 187, 202, 0.856);
  border-color: rgba(255, 255, 255, 0.6);
  transform: scale(1.05);
}

.comms-box:hover .box5-content {
  opacity: 1;
  visibility: visible;
}

.toggle {
  display: none;
}

.select-toggle {
  display: inline-block;
  background: rgba(126, 46, 119, 0.377);
  border: 1px solid rgba(255, 255, 255, 0.397);
  border-radius: 12px;
  color: white;
  font-size: clamp(0.9rem, 1.2vw, 1.2rem);
  padding: clamp(0.5rem, 1vw, 0.8rem) clamp(1rem, 2vw, 2rem);
  cursor: pointer;
  transition: all 0.2s ease;
  min-width: clamp(100px, 20vw, 200px);
  /* opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease, visibility 0.2s ease; */
}

.select-toggle:hover {
  background: rgba(69, 187, 202, 0.856);
}

.box5-text {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: all 0.2s ease;
  margin-top: 10px;
}

.toggle:checked + .select-toggle + .box5-text {
  max-height: 200px;
  opacity: 1;
}

.send-btn {
  display: flex;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

.send-btn button {
  display: inline-block;
  background: rgba(49, 130, 141, 0.603);
  border: 1px solid rgba(255, 255, 255, 0.397);
  border-radius: clamp(12px, 25px, 50px);
  color: white;
  font-size: clamp(1.2rem, 2.4vw, 2.4rem);
  font-weight: bold;
  padding: clamp(0.4rem, 1vw, 0.6rem) clamp(0.3rem, 0.2vw, 1.2rem);
  cursor: pointer;
  transition: all 0.3s ease;
  min-width: clamp(100px, 20vw, 200px);
  margin-bottom: 2rem;
}

.send-btn button:hover {
  background: rgba(69, 187, 202, 0.856);
}

.confirm-send:has(#confirm-submit:checked) ~ .send-btn {
  opacity: 1;
  /*margin-left: 39.3vw;*/
  pointer-events: auto;
}

.confirm-send {
  display: flex;
  justify-content: center;
  margin: 1.5rem auto;
  /*width: 80vw;*/
  max-width: 1600px;
  color: #fff;
  font-size: 1.2rem;
  pointer-events: auto;
}

.confirm-send input {
  margin-right: 0.5rem;
}

.confirm-send a:hover {
  color: rgb(197, 50, 160);
}


/* TEXT EDITOR STYLE */

.box2-content textarea,
.box4-content textarea{

  width: 80%;
  min-height: 100px;
  max-width: 800px;
  padding: 0.8rem;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.1);
  color: white;
  font-size: 1rem;
  resize: vertical;
  outline: none;
  backdrop-filter: blur(10px);
  transition: all 0.3s ease;

  resize: vertical;
  outline: none;

  pointer-events: auto;
  transform-origin: top center;
  transition: transform 0.35s cubic-bezier(.2,.9,.2,1);
}

.box2-content textarea:focus,
.box4-content textarea:focus {
  background: rgba(255, 255, 255, 0.2);
  border-color: rgba(255, 255, 255, 0.6);
}

.box5-content textarea{
  width: 80%;
  min-height: 100px;
  max-width: 800px;
  padding: 0.8rem;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.1);
  color: white;
  font-size: 1rem;
  resize: vertical;
  outline: none;
  backdrop-filter: blur(10px);
  transition: all 0.3s ease;
  margin-bottom: 1rem;

  resize: vertical;
  outline: none;

  pointer-events: none;
  transform-origin: top center;
  transition: transform 0.35s cubic-bezier(.2,.9,.2,1);
}

.box5-content textarea:focus {
  background: rgba(255, 255, 255, 0.2);
  border-color: rgba(255, 255, 255, 0.6);
}

/* BOX 3 SELECTOR */

.fullsong-extras,
.vocals-extras {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-height 0.35s ease, opacity 0.25s ease;
}

/* Full song selected */
#service-full:checked ~ .box-3 .fullsong-extras {
  max-height: 500px;
  opacity: 1;
}

/* Vocals selected */
#service-vocals:checked ~ .box-3 .vocals-extras {
  max-height: 300px;
  opacity: 1;
}

}
#fw-section-custom-html-7cb00674-cac2-4d7e-9e7a-bf100886f633 {

.form {
  display: flex;
  justify-content: center;
}
}

#fw-section-custom-html-b56d6fe5-c158-4387-afd4-772b1d8575af {

/* TITLE BOX */

.box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1vw 3vw;
  color: #fff;
  /* text-align: center; */
  margin: auto;
  margin-top: 2rem;
  max-width: 70vw;
  position: relative;
  overflow: hidden;
}

.box h1 {
  margin-top: 0.5rem;
  text-align: center;
  font-size: 3rem;
  font-weight: 700;
}

.box p {
  margin-top: 2rem;
  margin-bottom: 1rem;
  font-size: 1.2rem;
  text-align: left
}
}
#fw-section-custom-html-0ebb00b7-51b4-456c-8beb-a656df34bc01 {

/* BOX EXPANSION ANIMATION */

.terms-box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1vw 3vw;
  color: #fff;
  /* text-align: center; */
  margin: auto;
  /* margin-top: 2rem; */
  max-width: 45vw;
  position: relative;
  overflow: hidden;
}

.box-expand {
  display: flex;
  justify-content: space-between;
  align-items: center;

  cursor: pointer;
}

.expand-arrow {
  rotate: -90deg;
  transition: transform 0.3s ease;
}

.terms-box.open .expand-arrow {
  transform: rotate(90deg);
}

.expand-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}

.terms-box.open .expand-body {
  max-height: 1000px;
}

/* TEXT STYLING */

.box-expand span {
  font-size: 1.3rem;
  font-weight: 700;
}

.expand-body h1 {
  font-size: 1rem;
  text-transform: none;
  margin-top: 15px;
}

.expand-body h2 {
  font-size: 1.5rem;
  margin-top: 30px;
  margin-bottom: 10px;
}

.expand-body p {
  line-height: 30px;
}

.expand-body h3 {
  font-size: 0.8rem;
  text-transform: none;
  text-align: center;

  margin-top: 10px;

  transition: all 0.2s ease;
}

.expand-body h3 :hover {
  color: rgba(113, 17, 181, 0.8);
}
}

#fw-section-custom-html-9b73f394-eec8-448d-89d4-9d6eb399baad {

/* TITLE BOX */

.box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1vw 3vw;
  color: #fff;
  text-align: center;
  margin: auto;
  margin-top: 2rem;
  max-width: 70vw;
  position: relative;
  overflow: hidden;
  margin-bottom: 3rem;
}

.box h1 {
  margin-top: 0.5rem;
  font-size: 3rem;
  font-weight: 700;
}

.box p {
  margin-top: 2rem;
  margin-bottom: 1rem;
  font-size: 1.2rem;
}

/* LINKS TO SERVICES */

.services {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 3rem;
  max-width: 1000px;
  margin: auto;
}

.services {
  display: flex;
  justify-content: center;
}

.services h1 {
  font-size: 2.5rem;
  text-align: center;

  /* padding-top: 4.5rem; */
  padding-bottom: 1rem;

  transition: transform 0.3s ease, color 0.3s ease;
}

.services h1 a {
  text-decoration: none;
  color: inherit;
}

.services h1:hover {
  color: rgba(139, 19, 170, 0.86);
  transform: scale(1.05);
  cursor: pointer;
}

.service-box {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
  padding: 1rem 1rem;
  color: #fff;
  max-width: 13rem;
}

.service-box img:hover {
  cursor: pointer;
  transform: scale(1.05);
}

.service-box img {
  max-height: 13rem;
  max-width: auto;
  border-radius: 13px;
  transition: transform 0.3s ease;
}

.music h1 {
  text-align: center;
}

.art-2d h1 {
  text-align: center;
}

.art-3d h1 {
  text-align: center;
}

.video-editing h1 {
  text-align: center;
  font-size: 1.3rem;
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}
}

#fw-section-featured-collection-30f670b4-7912-4790-b0a2-e441983f5847 {

:hover {
  color:rgb(197, 50, 160);
  transition: all 0.3s ease;
}

/*.image.image--background-color {
  opacity: 0;
}*/


.button {
  display: inline-block;
  background: rgba(171, 43, 172, 0.55);
  border: 1px solid rgba(255, 255, 255, 0.397);
  border-radius: clamp(12px, 25px, 50px);
  color: white;
  font-size: clamp(0.9rem, 1.2vw, 1.2rem);
  padding: clamp(0.5rem, 1vw, 0.8rem) clamp(1rem, 2vw, 2rem);
  cursor: pointer;
  transition: all 0.3s ease;
  /*min-width: clamp(100px, 20vw, 200px);*/
}

.button:hover {
  background: rgba(55, 146, 158, 0.55);
}
}
#fw-section-featured-collection-bf70ef12-0154-4a4d-a55a-2d307bc54839 {

:hover {
  color:rgb(197, 50, 160);
  transition: all 0.3s ease;
}
}
#fw-section-featured-collection-7e8305a2-6e76-4027-832b-e9b301d2a4e8 {

:hover {
  color:rgb(197, 50, 160);
  transition: all 0.3s ease;
}
}
#fw-section-featured-collection-4816b30b-f06f-40e6-94b9-8a4501304c98 {

:hover {
  color:rgb(197, 50, 160);
  transition: all 0.3s ease;
}
}
#fw-section-featured-collection-99375e57-3456-40c7-ac7f-605691499737 {

:hover {
  color:rgb(197, 50, 160);
  transition: all 0.3s ease;
}
}

#fw-section-rich-text-178356108722561 {

h5, h6 {
  text-transform: none;
  font-size: 0.8rem;
}
}
#fw-section-rich-text-178356288675904 {

h5, h6 {
  text-transform: none;
  font-size: 0.8rem;
}
}

#fw-section-custom-html-cd08f5a1-c2ae-4479-ba83-9659a4014bc1 {

.doc-embed {
  display: flex;
  justify-content: center;
}
}
#fw-section-rich-text-e84b8b97-ab10-480f-b62f-3beb7b6b9e69 {

h5, h6 {
  text-transform: none;
  font-size: 0.8rem;
}
}


#fw-section-custom-html-1afc5b8f-e4be-4c74-96ad-945028edf7e0 {

.frosted-card {
  background: rgba(56, 56, 56, 0.23); /* translucent color */
  backdrop-filter: blur(20px);            /* blur behind it */
  -webkit-backdrop-filter: blur(20px);    /* Safari support */
  border-radius: 20px;                    /* rounded corners */
  border: 1px solid rgba(255, 255, 255, 0.3); /* subtle glass border */
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);

  /* Padding and layout */
  padding: 4vw 3vw;
  color: #fff;
  text-align: center;
  margin: auto;
  margin-top: 2rem;
  /*width: 80vw;*/
  max-width: 1600px;
  min-width: 280px;
  height: 90vh;

  position: relative;
  overflow: hidden;
}

.frosted-card h1 {
  font-size: 2.5rem;
  margin-bottom: 2.5rem;
  font-weight: 700
}

.frosted-card p {
  font-size: clamp(0.8rem, 1.5vw, 1.4rem);
  line-height: 1.8;
  margin-top: 2rem;
}
}
#fw-section-custom-html-a3326ea3-0398-4576-818f-27bcd6f53114 {

.socials-card {
  /* Padding and layout */
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 2rem;
  max-width: 1000px;
  margin: 0 auto;
  color: #fff;
  animation: fadeIn 1s ease forwards;
  position: relative;
  overflow: hidden;
  height: auto;
  text-align: center;
}

.socials-title {
  color: #fff;
  text-align: center;
  font-size: 2.5rem;
  font-weight: 700;

  /*width: 80vw;*/
  /*margin-left: auto;
  margin-right: auto;*/
  /* padding-left: 1vw; */
  padding-bottom: 3.5rem;

  transform: translateY(10px);
  animation: fadeIn 1s ease forwards;
  animation-delay: 0.3s; /* starts slightly after page load */
}

.socials-item {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.socials-item img {
  width: 70px;
  height: auto;     /* keeps aspect ratio */
  object-fit: contain;
  transition: transform 0.2s ease;
}

.socials-item img:hover {
  transform: scale(1.13);
}

.socials-item p {
  margin-top: 10px;
  text-align: center;
  font-size: clamp(0.2rem, 1rem, 1.5rem);
}
}
#fw-section-custom-html-19452839-a3a2-47e6-b9b6-461167cf75db {

.song-promo {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 150px;
}

.text h1 {
  text-align: left;
  max-width: 40rem;
  font-size: 2rem;
  line-height: 45px;
}

.text a {
  text-decoration: none;
}

.text a:hover {
    color: rgba(54, 212, 231, 0.86);
    transition: all 0.3s ease;
}

/* ======================== */

.cover-art {
  display: flex;
  justify-content: right;
  align-items: center;
}

.cover-art img {
  width: 300px;
  height: auto;
  border-radius: 25px;
  transition: transform 0.2s ease;
}

.cover-art img:hover {
  transform: scale(1.05);
}

.download-button {
  display: flex;
  justify-content: right;
  margin-top: 1rem;
}

.download-button :hover {
  cursor: pointer;
  color: rgba(194, 54, 231, 0.86);
  transition: all 0.3s ease;
}

.download-button a {
  text-decoration: none;
  margin-right: clamp(1rem, 12.5rem, 12.5rem);
}
}
#fw-section-recent-videos-1765842757 {

.button--small {
  background: rgba(126, 46, 119, 0.6);
}
}
#fw-section-footer {

.footer {
background: linear-gradient(rgba(0, 0, 0, 0),rgba(73, 73, 73, 0.5));
backdrop-filter: blur(10px); 
-webkit-backdrop-filter: blur(10px);
}

:hover {
    color: rgb(197, 50, 160);
    transition: all 0.3s ease;
}
}
#fw-section-header {

.header {
background: linear-gradient(rgba(73, 73, 73, 0.5), rgba(0, 0, 0, 0));
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
}

:hover {
    color: rgb(197, 50, 160);
    transition: all 0.3s ease;
}

.header__dropdown-inner {
  background: #A658A6D1;
  text-align: center;
}
}