/* =========================================================
   VITA UNIKA — KINETIC ACTION REST STATE V38

   Keep V37 hover/orb interaction.
   Make resting state clearly look clickable.
   ========================================================= */


/* =========================================================
   BOTH ACTIONS — CLEAR BUTTON SILHOUETTE
   ========================================================= */

html body .vita-hero-v15
.v37-action{

  overflow:hidden !important;

  border-radius:22px !important;

  border:
    1px solid
    rgba(11,121,120,.14) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.92),
    0 9px 28px rgba(19,39,37,.045) !important;

  transition:
    transform .7s cubic-bezier(.16,1,.3,1),
    color .45s ease,
    background .55s ease,
    border-color .5s ease,
    box-shadow .65s cubic-bezier(.16,1,.3,1) !important;
}


/* =========================================================
   BOOK — LIGHT TEAL SURFACE AT REST
   ========================================================= */

html body .vita-hero-v15
.v37-action--book{

  background:
    linear-gradient(
      135deg,
      rgba(11,121,120,.070) 0%,
      rgba(11,121,120,.035) 100%
    ) !important;

  border-color:
    rgba(11,121,120,.20) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.86),
    inset 0 -1px 0 rgba(11,121,120,.025),
    0 10px 28px rgba(11,121,120,.065) !important;
}


/* =========================================================
   SERVICES — WHITE / GLASS SURFACE AT REST
   ========================================================= */

html body .vita-hero-v15
.v37-action--services{

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.94) 0%,
      rgba(247,251,250,.82) 100%
    ) !important;

  border-color:
    rgba(11,121,120,.17) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,1),
    inset 0 -1px 0 rgba(11,121,120,.025),
    0 10px 28px rgba(19,39,37,.045) !important;

  backdrop-filter:
    blur(10px);

  -webkit-backdrop-filter:
    blur(10px);
}


/* =========================================================
   VERY SUBTLE INNER EDGE
   ========================================================= */

html body .vita-hero-v15
.v37-action > .v37-action__label{

  text-shadow:
    0 1px 0 rgba(255,255,255,.45);
}


/* =========================================================
   HOVER — BOX BECOMES MORE ALIVE
   V37 ORB BLOOM STILL RUNS ON TOP
   ========================================================= */

@media(hover:hover) and (pointer:fine){

  html body .vita-hero-v15
  .v37-action--book:hover{

    border-color:
      rgba(11,121,120,.34) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.18),
      0 20px 42px rgba(11,121,120,.17),
      0 0 0 5px rgba(11,121,120,.025) !important;
  }


  html body .vita-hero-v15
  .v37-action--services:hover{

    border-color:
      rgba(11,121,120,.34) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,1),
      0 18px 40px rgba(19,39,37,.075),
      0 0 0 5px rgba(180,141,66,.025) !important;
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:760px){

  html body .vita-hero-v15
  .v37-action{

    border-radius:19px !important;
  }

}